[英]Center navbar tabs for full size screens and within navbar-collapse for mobile screens
I've got a navbar
with several tabs on it. 我有一个带有几个选项卡的
navbar
。 When the screen size becomes small enough these tabs disappear and collect in the form of a clickable button, navbar-collapse
, which expands showing the tabs in a vertical manner. 当屏幕尺寸变得足够小时,这些选项卡消失并以可单击按钮
navbar-collapse
的形式收集,该按钮以垂直方式展开以显示选项卡。 I was able to have the elements in the dropdown centered with text-align: center
, but this does not seem to affect the tabs when the navbar
is fullsize. 我能够使下拉列表中的元素以
text-align: center
,但这在navbar
为全尺寸时似乎不会影响选项卡。 Is there a way to center the tabs both on fullsize and mobile (on the dropdown) which I was already able to do. 有没有一种方法可以将选项卡集中在全尺寸和移动设备上(在下拉菜单中),我已经能够做到。 Here's the JSFiddle: http://jsfiddle.net/sushiknives/c1zjbrmj/
这是JSFiddle: http : //jsfiddle.net/sushiknives/c1zjbrmj/
One note on the JSFiddle: you need to drag the result page far left to see what the page would look like full-size. 关于JSFiddle的一个注意事项:您需要将结果页面拖到最左边,以查看页面的外观。
One way is to use nav-justified
... 一种方法是使用
nav-justified
...
<ul class="nav nav-justified">
<li><a href="#">Home</a></li>
<li><a href="#">Condominii</a></li>
<li><a href="#">Chi Siamo</a></li>
<li><a href="#">Fornitori</a></li>
<li><a href="#">Contatti</a></li>
<li><a href="#">Dove Siamo</a></li>
</ul>
Demo: http://codeply.com/go/MSEeod5De9 演示: http : //codeply.com/go/MSEeod5De9
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.