我的下拉菜单在移动设备上没有问题，但在桌面设备上不会扩展到 home 或菜单栏之外。我希望它在单击时拉伸(stretch)整个页面宽度。请问我该怎么做？
我试过 CSS:
@media (max-width: 5000px) and (min-width: 768)
{#menu {width: 100%! Important;}}
它甚至没有移动一毫米。
HTML:
<div class="module widget-handle mobile-toggle right
visible-sm visible-xs"><i class="fa fa-bars"></i></div><div
class="module-group right"><div class="module left"><div
class="collapse navbar-collapse navbar-ex1-collapse"><ul
id="menu" class="menu"><li id="menu-item-1496"
class="menu-item menu-item-type-post_type menu-item-
object-page menu-item-home current-menu-item
page_item page-item-19 current_page_item menu-item-
has-children menu-item-1496 dropdown active"><a
title="Home" href="https://adsler.co.uk/">Home </a>.
<span class="dropdown-toggle shapely-dropdown" data-
toggle="dropdown"><i class="fa fa-angle-down" aria-
hidden="true"></i></span><ul role="menu" class="
dropdown-menu"><li id="menu-item-1502" class="fa fa-
user menu-item menu-item-type-post_type menu-item-
object-page menu-item-1502"><a title="Create Adsler
Account" href="https://adsler.co.uk/create-
account/">Create Adsler Account</a></li><li id="menu-
item-1499" class="fa fa-envelope menu-item menu-item-
type-post_type menu-item-object-page menu-item-
1499"><a title="Post
最佳答案
使用此 CSS 以获得更好的用户体验
.main-navigation .menu > li ul { padding: 10px; right: 0 !important;}
.main-navigation .menu > li > ul > li { display: flex; align-items: center;}
尝试从这里删除这个 left 0
.main-navigation .menu > li ul { left: 0; }
style.css line #1448
关于html - 如何在桌面上扩展菜单宽度？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55986925/