如何增加twitter bootstrap下拉菜单中的宽度。我需要列表将酒精事件和状态报告作为选项,但默认宽度不足以包含那么多文本。
<li class="dropdown subnavbar-open-right">
<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown"><span>Reports/Statistics</span><b class="caret"></b></a>
<ul class="dropdown-menu">
<li class="dropdown-submenu"><a>USN</a>
<ul class="dropdown-menu">
<li><a>Alcohol Incidents and Status Reports</a></li>
</ul>
答案 0 :(得分:1)
查看您提供的代码,我使用Twitter BootStrap的默认设置创建了一个测试页面,并添加了您的文本&#34;酒精事件和状态报告&#34;进入下拉菜单。我发现下拉菜单自动扩展,包括文本的整个宽度。
这意味着您要么为了正常工作而留下了一些必要的代码,要么覆盖了CSS类,导致它无法正常工作。这是代码:
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="brand" href="#">Name</a>
<div class="nav-collapse collapse">
<ul class="nav">
<li class="active"><a href="#">Home</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Alcohol Incidents and Status Reports</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li class="nav-header">Nav header</li>
<li><a href="#">Separated link</a></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
</div>
如果这对您没有帮助,那么您可能希望提供更多代码,以便人们可以帮助您进行调试。我有一个JSFiddle的链接,但似乎我们现在不允许发布这些链接。那么这里的扩展/ tS95X / 1 /如果你想查找它。