سلام!
من یه منو دارم که میخوام وقتی active بود یه مثلث کوچیک پایینش نمایش داده بشه که با after نوشتم. اما وقتی active میشه به li فعالم یه فاصله ای رو میده.
چطور میتونم برطرف کنم که این فاصله رو نده و دقیقا وسط و پایینه گزینه منو فعال قرار بگیره
.menu-bar li.item-menu { float: right; display: block; color: #fff; text-align: center; padding: 12px 16px; text-decoration: none; cursor:pointer; } .menu-bar .active:after { content: ''; border-style: solid; border-width: 0 10px 10px 10px; border-color: transparent transparent #fff; display:inline-block; position:relative; bottom:-20px; left:50%; }
کافیه به کلاس item-menu موقعیت relative دهیدو به کلاس active موقعیت absolute :
.menu-bar li.item-menu { float: right; display: block; color: #fff; text-align: center; padding: 12px 16px; text-decoration: none; cursor: pointer; position: relative; } .menu-bar .active:after { content: ''; border-style: solid; border-width: 0 10px 10px 10px; border-color: transparent transparent #fff; display: inline-block; position: absolute; bottom: 0px; left: 50%; }
هیچ کاربری تا کنون از این پست تشکر نکرده است
با ما تماس بگیرید تا در این مسیر همراهتان باشیم :)