Bootstrap .col很难过

时间:2016-08-09 14:32:20

标签: twitter-bootstrap vertical-alignment col

我无法让我的bootstrap col表现我想要的样子,我想知道是否有人可以提供帮助,因为我还是Bootsrap的新手。

我的目标是:

for larger screens, i want to have it like this:
------------------------------------
|                        |     2    |
             1           ------------
|                        |     3    |
------------------------ |          |
                         ------------

-i.e 2和3独立于1的高度,即使2推3低于1的底部也保持在同一列

For medium screens look tike this:
 -------------------------
|                        |
|           1            |
|                        |  
 ------------------------|         
|-----------|------------|
|      2    |     3      |
|-----------|------------|

- 其中2和3同样低于1

And for smallest screens look like this!
 --------- 
|         |
|    1    |
|         |
 --------- 
|    2    |  
 --------- 
|    3    |  
 --------- 

-all in single column

提前致谢!

1 个答案:

答案 0 :(得分:0)

这应该是一个简单的Bootstap布局,但很难说没有看到你的代码而不知道内容的高度。

    <div class="row">
        <div class="col-md-8 col-sm-12">
            1
        </div>
        <div class="col-md-4 col-sm-6">
            2
        </div>
        <div class="col-md-4 col-sm-6">
            3
        </div>
    </div>

http://codeply.com/go/KaeCBJoXJW