所以你有一组内联 div。它们的宽度是硬编码的，但内部内容可以更改，这意味着 div 的高度不同。
有什么方法可以确保所有 div 保持相同的高度，而不会有内容溢出其父 div 的危险吗？
我尝试过继承 min-height 但似乎这不是动态的。因此，如果父 div 将 min-height 设置为 320px 并且同级 div 继承该值，如果任何同级由于内容而变得高于 320，则它和父 div 将发生变化，但其他同级将保持在320.
有没有什么方法可以解决这个问题而不使用CSS以外的任何东西？
简单地利用 CSS 的表格display https://developer.mozilla.org/en-US/docs/Web/CSS/display.
采取以下示例标记：
<div>
<figure>Example one</figure>
<figure>This is example twooooo</figure>
<figure>3</figure>
</div>
如果你三个都想要figure元素保持恒定的高度，同时确保它们永远不会逃逸到边界之外div容器，简单地说：
div {
display:table;
}
div > figure {
display:table-cell;
}
三个全部figure元素现在将保持相同的高度 - 内容最多的元素的高度or the min-height包含分隔符的值，以较大者为准。
这是一个JSFiddle 示例 http://jsfiddle.net/zYQeW/1/在行动中展示这一点。请注意我是如何给出的div灰色背景颜色figure元素永远不会逃出边界。
有关浏览器支持，请参阅：http://caniuse.com/#feat=css-table http://caniuse.com/#feat=css-table
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
