问题描述
引导2.0有任何帮助,使.span1,.span2 .... .span12等高。我嵌套了这种类型的html
Does bootstrap 2.0 have any helpers to make .span1, .span2 .... .span12 equal height. I've nested this type of html
<div class='container'>
<div class='row'>
<div class='span2'>
<div class='well'>
XXXX
</div>
</div>
<div class='span2'>
<div class='well'>
XXXX
XXXX
</div>
</div>
<div class='span2'>
<div class='well'>
XXXX
XXXX
XXXX
</div>
</div>
</div>
</div>
如果可能的话,我想让每口井结束相同的高度?
I would like each well to end up the same height if possible?
推荐答案
这里是一个响应式CSS解决方案,基于添加一个大填充和同样大的负边距到每个列,然后包装整个行在一个类溢出隐藏。
Here's a responsive CSS solution, based on adding a large padding and an equally large negative margin to each column, then wrapping the entire row in in a class with overflow hidden.
.col{
margin-bottom: -99999px;
padding-bottom: 99999px;
background-color:#ffc;
}
.col-wrap{
overflow: hidden;
}
您可以看到它在
编辑
针对某个问题,如果您需要相等的高度井或具有圆角的等高栏,请使用以下变体形式:
In response to a question, here's a variation if you need equal height wells or equal height columns with rounded corners: http://jsfiddle.net/panchroma/4Pyhj/
编辑
到一个问题,这里是相同的技术在Bootstrap 3,同样的原则,只是更新在Bootstap网格中的类名称:
In response to a question, here's the same technique in Bootstrap 3, same principle, just update the class names in the Bootstap grid: http://jsfiddle.net/panchroma/bj4ys/embedded/result/
这篇关于使用twitter bootstrap 2.0 - 如何使相等的列高度?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!