Html 使用盒子大小是否存在任何已知问题？

问题

我已经设置了我的CSS

*, *:before, *:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
     box-sizing: border-box;
     margin:0;
     padding:0
}

尽管我这样做了，但在不同的浏览器中，div的高度与设置的高度不一致

Div的CSS有问题

.content.one /*inquiry form*/ {
    position: absolute;
    float: left;
    display: none;
    top: 50px;
    height: 615px;
    left: -255px;
    width: 960px;
    z-index: 5;
    padding-left: 50px;
    padding-right: 50px;
    padding-top: 5px;
    padding-bottom: 10px;
    background-color: #000000;

}

---

您必须使用非标准属性才能使用（sad，但代码将变得无效，因为它们：（）

因此，完整的样式将是：

div {
    width: 300px;
    background: #ccc;
    padding: 20px;
    -moz-box-sizing: border-box; /* Firefox */
    -webkit-box-sizing: border-box; /* Safari, Chrome */
    box-sizing: border-box; /* ie, opera */
}

现在div将是

300px

宽度，带有所有边距和填充

缺点之一是

框大小调整

属性在IE6和IE7中不起作用

可以改为使用嵌套层：

Html:

---

来源：

您能更具体地说明哪些浏览器有问题以及它们是什么吗？Firefox和Chrome在固定高度分区中显示不同的高度。这不是我已经做过的吗？请看我的css代码片段。@DanCundy您的问题是

使用框大小是否有任何已知问题？

。我告诉过您已知的问题：issie6和ie7中的问题，并解释了如何避免这些问题。也许有人会帮助你更好，对不起。这很公平！我也在帖子下方发布了一个问题。但无论如何，谢谢你！正如@ExplosionPills所说：

你能更具体地说明哪些浏览器有问题以及它们是什么吗？

Firefox和Chrome在修复中显示不同的高度ed height div，仅当我启用“框大小：框边框”属性时才会发生。当我删除该行时，不同浏览器的div都是相同的。我可以删除它，然后调整所有内容的大小，但我更愿意找出它为什么这样做。

div {
    width: 300px;
    background: #ccc;
    padding: 20px;
    -moz-box-sizing: border-box; /* Firefox */
    -webkit-box-sizing: border-box; /* Safari, Chrome */
    box-sizing: border-box; /* ie, opera */
}

<div class="block">
    <div>I have 100% width</div>
</div>

.block { 
    width: 150;
}
.block div {
    background: #fc0;
    margin: 10px;
    padding: 20px;
    border: 1px solid #000;
}