css - Bootstrap 列垂直堆叠而不是水平堆叠

Question

我使用 col-sm-4 将一行分成 3 列。现在我希望这一行被水平分为三个部分。但它是垂直划分的。

参见 Jsfillde

这是我的代码

<div class="container">
    <div class="row"  style="padding:13px 15px;">
        <div class="pull-left span4">
            <a href=""><img src="themes/custom/img/logo.png" width="120" alt="logo"/></a>
        </div>
        <div class="pull-right span4">
            <div class="row">
                <div class="col-sm-4">One</div>
                <div class="col-sm-4">Two</div>
                <div class="col-sm-4">Three</div>
            </div>
        </div>
    </div>
</div>

我在左侧保留了一个 Logo ，在右侧有一排我想水平分成 3 部分。

我做错了什么？

Answer 1

您的代码运行良好。 .col-sm-* 类适用于宽度为 768px 及以上的情况。如果你想让这三个 div 始终水平放置，你必须在你的情况下使用类 .col-xs-4。 Updated jsfiddle

进一步阅读 - http://getbootstrap.com/css/#grid-options