Codepen展示了我所谈论的内容:
http://codepen.io/anon/pen/dGopxL
有没有办法让第二列(红色背景)始终与第一列的高度相同?
使高度100%不起作用,因为我从未设定固定高度,所以我不确定如何做到这一点。我可以使用Javascript / jQuery将它们设置为彼此相等,并在页面调整大小时不断更新它,但如果可能的话,我想在没有JS的情况下进行更新。
任何提示?
以下是Codepen的代码:
.container {
width: 800px;
margin: 0 auto;
background-color: #EEE;
}
div {
display: inline-block;
}
.col1 {
width: 50%;
}
.col2 {
background-color: tomato;
width: 50%;
text-align: center;
vertical-align: top;
}

<div class="container">
<div class="col1">
<img src="http://placecage.com/400/400">
</div>
<div class="col2">
<p>Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum
Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum</p>
</div>
</div>
&#13;