我试图修改导航栏子菜单,但能够找到它。在下面的代码中,我只需要将宽度从12em更改为“ auto”即可修复子菜单。当前,文本与背景重叠。
element.style {
float: none;
width: 12em;
visibility: hidden;
display: none;
}
引用菜单的html文件是这样的:
<div class="menu-box">
<div id="menu-bar" class="nav clearfix">
<nav id="block-superfish-1" class="block block-superfish block-odd block-count-2 block-region-menu-bar menu-wrapper clearfix clearfix" role="navigation">
<h2 class="block-title element-invisible element-invisible">Main menu</h2>
<ul id="superfish-1" class="sf-menu main-menu sf-horizontal sf-style-none sf-total-items-5 sf-parent-items-4 sf-single-items-1 main menu sf-js-enabled sf-shadow">
<li id="menu-218-1" class="first odd sf-item-1 sf-depth-1 main menu list sf-total-children-1 sf-parent-children-0 sf-single-children-1 menuparent">
<a class="sf-depth-1 menuparent" href="/">Home</a>
<ul style="float: none; width: 12em; display: none; visibility: hidden;">
</li>
<li id="menu-409-1" class="middle even sf-item-2 sf-depth-1 main menu list sf-total-children-2 sf-parent-children-0 sf-single-children-2 menuparent">
<a class="sf-depth-1 menuparent" href="/%3Cnolink%3E">What's exciting us</a>
<ul style="float: none; width: 12em; visibility: hidden; display: none;">
<li id="menu-411-1" class="first odd sf-item-1 sf-depth-2 main menu list sf-no-children" style="white-space: normal; float: left; width: 100%;">
<a class="sf-depth-2 " href="/around-the-globe" style="float: none; width: auto;">Innovative ideas from around the globe</a>
</li>
<li id="menu-410-1" class="last even sf-item-2 sf-depth-2 main menu list sf-no-children" style="white-space: normal; float: left; width: 100%;">
<a class="sf-depth-2 " href="/showcased-ideas" style="float: none; width: auto;">Showcased ideas from within the community</a>
</li>
</ul>
</li>
<li id="menu-412-1" class="middle odd sf-item-3 sf-depth-1 main menu list sf-total-children-3 sf-parent-children-0 sf-single-children-3 menuparent">
<a class="sf-depth-1 menuparent" title="" href="/%3Cnolink%3E">Shared insight</a>
<ul style="float: none; width: 12em; visibility: hidden; display: none;">
<li id="menu-413-1" class="first odd sf-item-1 sf-depth-2 main menu list sf-no-children" style="white-space: normal; float: left; width: 100%;">
<a class="sf-depth-2 " href="/expert-panel" style="float: none; width: auto;">Expert Panel</a>
</li>
<li id="menu-414-1" class="middle even sf-item-2 sf-depth-2 main menu list sf-no-children" style="white-space: normal; float: left; width: 100%;">
<a class="sf-depth-2 " href="/investment-community" style="float: none; width: auto;">Investment Community</a>
</li>
<li id="menu-415-1" class="last odd sf-item-3 sf-depth-2 main menu list sf-no-children" style="white-space: normal; float: left; width: 100%;">
<a class="sf-depth-2 " title="" href="/thought-leaders" style="float: none; width: auto;">Thought Leaders</a>
</li>
</ul>
</li>
<li id="menu-420-1" class="middle even sf-item-4 sf-depth-1 main menu list sf-total-children-3 sf-parent-children-0 sf-single-children-3 menuparent">
<a class="sf-depth-1 menuparent" href="/%3Cnolink%3E">Interact</a>
<ul style="float: none; width: 12em; visibility: hidden; display: none;">
<li id="menu-421-1" class="first odd sf-item-1 sf-depth-2 main menu list sf-no-children" style="white-space: normal; float: left; width: 100%;">
<li id="menu-758-1" class="middle even sf-item-2 sf-depth-2 main menu list sf-no-children" style="white-space: normal; float: left; width: 100%;">
<li id="menu-422-1" class="last odd sf-item-3 sf-depth-2 main menu list sf-no-children" style="white-space: normal; float: left; width: 100%;">
</ul>
</li>
<li id="menu-312-1" class="last odd sf-item-5 sf-depth-1 main menu list sf-no-children">
</ul>
</nav>
</div>
</div>
我不知道要编辑哪个样式表和哪一行。
顺便说一句,我正在使用Drupal 7和superfish模块。
最佳答案
这些看起来像在Superfish的Supersubs插件下设置的默认宽度。
您可以通过配置有问题的菜单块并在“ Superfish插件”>“ Supersubs”下编辑最小和最大宽度来编辑宽度。
或者,您可以禁用Supersubs并在样式表中设置宽度。