0

我将第一次使用 Bootstrap 创建响应式设计,只需设置导航元素。

但这是我的问题:导航容器不在页面中心。

请看 1.jpg 这是我目前为止的。看看我想要的 2.jpg。![这是我目前拥有的][1]

虽然如果我使用我自己的包装器.mainContainer,那就是我想要的。但想知道是否有可能通过引导 css 达到预期的结果?

我尝试了几种方法,例如文本对齐中心等...![我想要的][2]

这是我的代码:

<div class="container-fluid">   
    <div class="row-fluid">
        <nav>            
            <div class="navbar-inner" >        
                <ul class="nav nav-pills">
                    <li class="active"><a href="#">Home</a></li>
                    <li><a href="#">About Us</a></li>
                    <li><a href="#">Blog</a></li>
                    <li><a href="#">Workshops</a></li>
                    <li><a href="#">Entertainment</a></li>
                    <li><a href="#">Contact Us</a></li>      
                </ul>
            </div>
        </nav>
    </div>  
</div>

我也尝试了偏移跨度,但没有得到我想要的。如果我使用.container好的类但想使用.container-fluid. 让我知道如何解决此问题。

4

1 回答 1

0

看看这个:http ://bootply.com/73827

您可以使用以下方法使菜单居中:

nav {
    text-align: center;
}
.navbar-inner {
    display: inline-block; /* makes element respond to parent's text-align */
}
于 2013-08-13T07:46:37.127 回答