在对twitter的引导程序进行一些实验时,我试图制作一个导航栏,左侧是Brand,旁边是折叠菜单,最后是一组未扩展的图标。
这是一个 didd'diddle:
还有问题的部分:
<!-- Non-collapsing right-side icons -->
<div class="navbar-header navbar-right pull-right">
<ul class="nav pull-right">
<li class="pull-right"><a href="#">
<img style="max-width:32; vertical-align:middle;" src="img/icon1.png">
</a></li>
<li class="pull-right"><a href="#">
<img style="max-width:32; vertical-align:middle;" src="img/icon2.png">
</a></li>
</ul>
</div> <!--/.navbar-right -->
Run Code Online (Sandbox Code Playgroud)
正如您在小提琴中看到的那样,当菜单折叠时,就可以了。但是,当窗口大到足以展开菜单时,图标就会向左移动(在品牌和菜单之间)。
我还尝试将非折叠图标放在navbar-header之外:在这种情况下,展开的navbar可以,但是折叠版本变得错误(图标在不同的行中)。
预先感谢您的帮助。