html - 为什么 height 和 min-height 对子容器的影响不同？

Question

在我的 css 中，我将父项的高度设置为 75px，将子项的高度设置为 100%，并且显示正确。但是，当我将父项的高度属性更改为 75px 的最小高度时，子项会缩小到它包含的文本的高度，但父项的高度仍为 75px。为什么 child 不保持75px？

#parent{
    height:75px;
    background-color:navy;
    clear:left;
    }
#child{
    width:300px;
    height:100%;
    background-color:aqua;
    float:left;
    }

在这里， child 是 75px，就像它应该的那样。

#parent{
    min-height:75px;
    background-color:navy;
    clear:left;
}
#child{
    width:300px;
    height:100%;
    background-color:aqua;
    float:left;
    }

child 现在只有 21px 高。

Answer 1

我相信这是 CSS 中长期存在的错误(或“功能”)。参见 https://stackoverflow.com/a/3808701/1608085

简而言之，你可以使用

min-height: inherit; 

在 child 中正确继承 parent 的最小高度属性。