html - 直接声明元素的 (min-/max-)width/height 或使用 100% 并从外部继承

Question

这fiddle显示了我拥有的标记的一个非常基本的版本。我希望 .module-container 在 230px(最小高度)和 300px(最大高度)之间调整大小。基本上我想知道的是是否在 .row 上设置 min-/max-height 并给 .module-container 一个 height: 100 %; 或者明确地给每个 .module-container 一个(最小/最大)高度以及 100% 的高度和包含的 .row像这样环绕它

min-height: 14.375em; /* 230px, 1em=16px */
height: 100%;
max-height: 18.75em; /* 300px, 1em=16px */

我期望的是 div 在 230px 和 300px 之间增长。但是，当包含 .row 的容器没有明确的高度并因此环绕每个 .column 时，这是否有效？

Answer 1

在 .module-container 上设置它。无需设置 height: 100%; 因为任何 block 级别的元素都会展开以包裹其内部元素。