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

时间:2015-03-14 10:06:23

标签: css twitter-bootstrap grid

我使用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>

我在左侧和右侧都有一个标识,有一排我想水平划分为3个部分。

我做错了什么?

2 个答案:

答案 0 :(得分:9)

您的代码运行正常。 .col-sm-*类适用于宽度768px及以上。如果你想让这三个div总是水平的,你必须在你的情况下使用类.col-xs-4Updated jsfiddle

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

答案 1 :(得分:-6)

我遇到了同样的问题并且在我的智慧结束时。然后我刷新浏览器,它工作。