CSS填充覆盖溢出？

Question

这里发生了什么事？

#agendaTitle{
    margin:0;
    padding:20em 0em 0em 0.75em;
    height:3em;
    overflow:hidden;
    background-color:#ff00ff;
}

顶部填充是非常高的只是为了证明 - 有了现实的要求div仍然按比例增加高度.

当然,overflow:hidden我应该看到一块颜色的手段？在FF和IE中发生

Answer 1

在元素的默认content-box框模型中display: block,padding并将height它们相加以确定元素的总高度. overflow只影响盒子外面的东西(高度+填充+边框之外).

如果您希望从指定高度减去边框和填充而不是添加,请使用box-sizing: border-box.

CSS填充覆盖​​溢出？