<分区>
编辑问题以包含 desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem .这将有助于其他人回答问题。
关闭 8 年前。
<分区>
编辑问题以包含 desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem .这将有助于其他人回答问题。
关闭 8 年前。
我已尝试解决我的问题，但答案并没有解决我的具体问题。
当子菜单展开时，会出现空白区域，尽 pipe 菜单位于下拉菜单的左侧。
我在这里嵌入了我的导航栏代码: 'jsfiddle.net/nickiname/Lds2bkuv/'
<!-- Fixed navbar -->
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span></button>
<a class="navbar-brand" href="index.html"><img src="images/logo2.png" alt="Lichtenberg Europaschule"></a>
<div class="navbar-collapse collapse navbar-responsive-collapse">
<ul class="nav navbar-nav navbar-left">
<li class="active"><a href="index.html"><span class="glyphicon glyphicon-home"></span></a></li>
<li><a href="#eltern">Eltern</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Schüler <b class="caret"></b></a>
<ul class="dropdown-menu">
<li class="dropdown-header">Aktuelles</li>
<li><a href="dateien/vertretungsplan.pdf" target="_blank"><span class="glyphicon glyphicon-download"></span> Vertretungsplan</a></li>
<li><a href="dateien/klausurenplan.pdf" target="_blank"><span class="glyphicon glyphicon-download"></span> Klausurenplan</a></li>
<!--Dropdown-Submenu-->
<li class="dropdown-submenu">
<a href="#" id="Stundenpläne" class="dropdown-toggle" data-toggle="dropdown">Stundenpläne <span></span></a>
<ul class="dropdown-menu dropdown-submenu unstyled" role="menu">
<li class="dropdown-header">Sekundarstufe I</li>
<li><a href="#Stundenpläne">1</a></li>
<li><a href="#Stundenpläne">2</a></li>
<li><a href="#Stundenpläne">3</a></li>
<li class="divider"></li>
<li class="dropdown-header">Sekundarstufe II</li>
<li><a href="#Stundenpläne">1</a></li>
<li><a href="#Stundenpläne">2</a></li>
</ul>
</li><!--/.Dropdown-Submenu-->
<li><a href="https://www.facebook.com/pages/SV-Luo-Darmstadt/170279079649692?fref=ts" target="_blank">SV</a></li>
<li class="divider"></li>
<li class="dropdown-header">Häufig benutzt</li>
<li><a href="lehrerliste.html">Lehrerliste</a></li>
<li><a href="#">Virtuelles ...</a></li></!--/.dropdown-submenu--></!--dropdown-submenu--></ul></li></ul></div></div></div></!-->
这里还有一些图片，因为我使用的是 Bootstrap 类，我无法将它们嵌入到那里。
下拉列表(未打开):https://www.dropbox.com/s/9ykv61sjwd8bnfd/Bildschirmfoto%202015-05-25%20um%2021.58.13.png?dl=0
下拉菜单(打开): https://www.dropbox.com/s/nz19ofk846vl9o1/Bildschirmfoto%202015-05-25%20um%2021.58.33.png?dl=0
非常感谢您的宝贵时间!
最佳答案
您可以在 .dropdown-submenu>.dropdown-menu 中尝试“position:absolute”，在您的 css 代码中。
.dropdown-submenu>.dropdown-menu{
position:absolute;
top:0;
left:-100%;
max-width:160px;
margin-top:-6px;
margin-left:35px;
}
关于html - 打开子菜单而不创建空白空间，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30445356/