Html 引导导航栏中的对中链接（在li&x27；s内）

我已经实现了几乎解决了我的问题的解决方案，但是，我需要

在整个导航栏之间居中，而不仅仅是相邻的元素（

我的导航栏是
96px
，而不是默认的
40px
，我想要
）>
显示在其他元素的中心和“下方”，因为它有自己的背景色等

以下是我目前的代码：

<div class="navbar navbar-inverse navbar-fixed-top center">
    <div class="navbar-inner">
        <div class="container-fluid">
            <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </a>
            <a class="brand" href="/home"><img src="http://jayeshcp.files.wordpress.com/2013/03/twitter-bootstrap.jpg" style="width:400px;height:60px;" /></a>
            <div class="nav-collapse collapse">
                <ul class="nav">
                    <li><a href="#">One</a></li>
                    <li><a href="#">Two</a></li>
                    <li><a href="#">Three</a></li>
                    <li><a href="#">Four</a></li>
                </ul>
                <p class="navbar-text pull-right">
                    <input class="span2" type="text" placeholder="Email">
                    <input class="span2" type="password" placeholder="Password">
                </p>
            </div><!--/.nav-collapse -->
        </div>
    </div>
</div>

我如何将
ul
居中，并在不破坏引导中所有其他内容的情况下在上面填充它？如果有其他货币，我将提供更多的赏金

edit:jsfiddle is（对不起，我粘贴了整个缩小的css文件（具有自定义导航栏高度），而不是引用它。下面是其他自定义设置。）

jsfiddle：

以下是将其放置在下方而不是下方的解决方案：

.navbar .nav
{
   position: absolute;
   left:0;
   right:0;
   width: 100%;
   background-color:yellow;
}
p.navbar-text
{
   width: 440px;
   text-align:right;
   position:relative;
   z-index:2
}
.navbar .brand 
{ 
   position: relative; 
   z-index:2; 
   padding: 0; 
   width: 30%;
   height: 60px;
   background-image: url('http://placehold.it/400x60&text=Your Logo Here');
   background-repeat: no-repeat; background-size: contain;
   margin: 18px 0;
   background-position: center left
}
.navbar .brand img
{
   display:none;
}

Jsfiddle:
请制作一个Jsfiddle。好的，我会试试。可能需要我一点时间才能让它准确。我会很快用它编辑我的帖子，除非我在完成之前得到一个答案。有点像：？是的，除了更大的导航栏和一个愚蠢的徽标。我用一个Jsfiddle链接更新了我的帖子。整个想法是让链接放在其他东西下面，并且总是这样s居中。这不起作用，因为它增加了导航栏的高度。
必须绝对定位，我认为。（徽标图像只是为了演示，我会将其定位得更高一点）这将在下面：我将黄色背景应用于ul，以便您可以看到它的大小/宽度。这看起来像解决方案：）我刚刚在“.navbar.nav”中添加了一些“padding top”。我会继续测试的。我应该使用填充还是空白？在这种情况下，它们似乎都做了相同的事情。它们在效果上应该是相似的。这里有一个我从placeholder.it更改了徽标，将其移动到一个样式并隐藏img，并使其缩放一些，为更小的屏幕腾出更多的空间：这更好！有没有办法使“.jcenter.navbar.nav、.jcenter.navbar.nav>li”在较小屏幕上启动时向左浮动而不是不浮动（即向左浮动导航链接）？如果这太过分了，并且会引起其他问题，我可以忍受它呆在中心。
p.navbar-text
{
    float: none;
    position: relative;
    text-align: right;
}
.navbar .nav
{
    display:block !important;
    float: right !important;
    width: 100%;
}

.navbar .nav
{
   position: absolute;
   left:0;
   right:0;
   width: 100%;
   background-color:yellow;
}
p.navbar-text
{
   width: 440px;
   text-align:right;
   position:relative;
   z-index:2
}
.navbar .brand 
{ 
   position: relative; 
   z-index:2; 
   padding: 0; 
   width: 30%;
   height: 60px;
   background-image: url('http://placehold.it/400x60&text=Your Logo Here');
   background-repeat: no-repeat; background-size: contain;
   margin: 18px 0;
   background-position: center left
}
.navbar .brand img
{
   display:none;
}