html - 如何设置两个div的高度等于css

Question

我想让 2 个 div 的高度相等，如果一个更大，另一个应该拉伸(stretch)到它的高度。我只想使用 CSS。以下是我的代码(Fiddle):

HTML:

<div class="common">
    lorem ipusm random text just for check
</div>
<div class="common">
    lorem ipusm random text just for check lorem ipusm random text just for check
</div>

CSS:

.common{
  border:1px solid red;
  float:left;
  margin-left:5px;
  width:20%;
  padding:5px;
}

这是 fiddle为此

Answer 1

您可以使用flexbox 模型。只需为 div 添加一个容器。并为父级添加 display: flex，为子级添加 flex: 1。

已编辑 jsfiddle

您可以在 http://css-tricks.com/snippets/css/a-guide-to-flexbox/ 上找到有关 flexbox 的更多信息