0
我有一個導航欄,有一些li標籤,當它們在較小的屏幕尺寸下時,會落在彼此之下。我想要導航欄保持相同的高度,並在較小的設備屏幕上進行水平滾動,但是我嘗試的所有內容都無法正常工作。請問有人可以照亮這裏的錯誤!如何獲得一個導航菜單欄水平滾動
HMTL:
<nav role="navigation" class="site-navigation main-navigation">
<div class="menu">
<ul>
<li class="page_item page-item-40"><a href="http://localhost/property_abba/for-sale/">Buy</a></li>
<li class="page_item page-item-41"><a href="http://localhost/property_abba/for-rent/">Rent</a></li>
<li class="page_item page-item-7"><a href="http://localhost/property_abba/sell/">Sell</a></li>
<li class="page_item page-item-9 current_page_item"><a href="http://localhost/property_abba/valuations/">Valuations</a></li>
<li class="page_item page-item-15"><a href="http://localhost/property_abba/property-management/">Property Management</a></li>
<li class="page_item page-item-11"><a href="http://localhost/property_abba/about-us/">About Us</a></li>
<li class="page_item page-item-13"><a href="http://localhost/property_abba/contact-us/">Contact Us</a></li>
</ul>
</div>
</nav>
CSS:
@media screen and (max-width : 480px){
div.menu ul {
display: inline-block;
max-height: 34px;
overflow: auto;
white-space: nowrap;
}
div.menu a {
display: inline-block;
text-align: center;
}
}
不過這目前是行不通的。