twitter-bootstrap Twitter Bootstrap - 2 列布局
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14227154/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Twitter Bootstrap - 2 column layout
提问by user984621
How can I make 2 column layout with Twitter Bootstrap? I use this scheme:
如何使用 Twitter Bootstrap 制作 2 列布局？我使用这个方案：
<div class="container">
<div class="row">
<div class="span2">
Red rectangle
</div>
<div class="span6">
Blue rectangle
</div>
<div class="span6">
Blue rectangle
</div>
<div class="span6">
Blue rectangle
</div>
<div class="span6">
Blue rectangle
</div>
</div>
</div>
Which generates this layout:
生成此布局：
I would like to have the blue rectangles always "on the right", not left.
我想让蓝色矩形总是“在右边”，而不是左边。
What am I doing wrong?
我究竟做错了什么？
回答by kalhartt
You might want to review the scaffolding documentation. It sounds more like you want rows nested inside your right hand column.
您可能需要查看脚手架文档。听起来更像是您希望将行嵌套在右手列中。
<div class="container">
<div class="row">
<div class="span2">
Red Rectangle
</div>
<div class="span6">
<div class="row">
<div class="span6">
Blue Rectangle
</div>
</div>
<div class="row">
<div class="span6">
Blue Rectangle
</div>
</div>
<div class="row">
<div class="span6">
Blue Rectangle
</div>
</div>
<div class="row">
<div class="span6">
Blue Rectangle
</div>
</div>
</div>
</div>
</div>
It might not actually be necessary to wrap each blue rectangle in a "row" div, with span6 they should stack. But its cleaner this way.
实际上可能没有必要将每个蓝色矩形包装在一个“行”div 中，它们应该堆叠在 span6 中。但是这样更干净。
回答by SeanPlusPlus
you want to use the .offset*class. in the above case, you'll want to use .offset6to make the rectangles float to the far right.
你想使用这个.offset*类。在上述情况下，您需要使用.offset6使矩形浮动到最右侧。
see offsetting columnshere:
见offsetting columns这里：
http://twitter.github.com/bootstrap/scaffolding.html#gridSystem
http://twitter.github.com/bootstrap/scaffolding.html#gridSystem
