css - 引导跨度错误地居中

Question

我正在布置一个导航栏，结果全错了。我想要一个左右组件，所以我使用两个 span6。但我发现第一个 span6 以它自己的线为中心。Chrome 的开发工具显示居中的 div 具有正确的尺寸和 20px 的左边距——它只是居中。好像容器是居中的呢？

这是导航视图的 HTML：

<div id="group_and_date_controls" class="container">
    <div class="row">
        <div id="group_control" class="span12">
          <ul>
            <span id="new_group">New Group</span>
            <li class="controlItem">hi</li>
            <li class="controlItem">hi</li>
          </ul>
        </div>
        <div id="date_control" class="span6 navbar pull-right">
          <ul id="thing" class="nav pull-right">
            <li>Jun 12th</li>
            <li>Today, Jun 13th</li>
            <li>Jun 14th</li>
          </ul>
        </div>
    </div>
</div>

Answer 1

“我想要一个左右组件，所以我使用了两个 span6。”

...除非您的代码与您在问题中发布的代码相同，否则您使用的是一个span12，然后是一个span6。这是一个使用两个span6类的版本。

http://jsfiddle.net/FtPZf/

<div id="group_and_date_controls" class="container">
    <div class="row">
        <div id="group_control" class="span6">
          <ul>
            <span id="new_group">New Group</span>
            <li class="controlItem">hi</li>
            <li class="controlItem">hi</li>
          </ul>
        </div>
        <div id="date_control" class="span6 navbar pull-right">
          <ul id="thing" class="nav pull-right">
            <li>Jun 12th</li>
            <li>Today, Jun 13th</li>
            <li>Jun 14th</li>
          </ul>
        </div>
    </div>
</div>