我正在使用 bootstrap 的网格布局并具有以下标记:
<div id="prof_cont_enclose">
<div class="row">
<div class="prof_cont_row">
<div class="col-xs-12 col-sm-4 col-md-2 col-lg-2 prof_elem">
<div class="panel panel-default">
<div class="panel-body">
<img src="/techahoy/securedir/m_images/mypic.jpg" width="100%">
</div>
</div>
</div>
<div class="col-xs-12 col-sm-4 col-md-2 col-lg-2 prof_elem">
<div class="panel panel-default">
<div class="panel-body">
<h1>T.V.Vignesh</h1>
</div>
</div>
</div>
</div>
</div>
</div>
我已将第 1 列中的图片的宽度设置为 100%,这意味着它将扩展到该列的宽度并相应地调整其高度以保持纵横比。所以,我没有固定的列高度。
我想做的是保持第一行中其他列的高度与第一列的高度相匹配。
我提到了 http://getbootstrap.com.vn/examples/equal-height-columns/但它不起作用。请帮帮我。
最佳答案
查看此代码笔: http://codepen.io/dschu/pen/zGQLNN?editors=110
您忘记了您的自定义 CSS:
.row-eq-height {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
我还删除了标题周围的一个包装 div。
关于javascript - 相对于另一个分区的 Bootstrap 列高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32074122/