css - IE7 - box-sizing 即使对于固定宽度的元素也不起作用

Question

我的布局中有一个 div，它具有分配给它的 box-sizing 属性，其值为 border-box。它在其他浏览器中运行良好，但在 IE7 中不起作用。我已经读过对于固定宽度的元素，它是有效的。 IE 开发人员工具显示 box-sizing 属性已正确分配。 CSS 代码:

.item {
    width:360px;
    background:#FFFFFF;
    border:0;
    border-bottom:1px solid #DDDDDD;
    padding:12px 24px;
    margin-bottom:24px;
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
}

它破坏了布局。

Answer 1

很遗憾，IE7 不支持 box-model: border-box 而是使用 W3C 内容框模型。这里有几个选项 - use a polyfil或者在条件注释中编写特定的 IE7 规则。