css - 与 Firefox 和 Chrome 相比，IE 中的 Div 高度不同

Question

当我将高度添加到 div 标签时，它的高度与 ie 和 firefox 不同。我不能将 100% 放在 div 标签上。你能帮我解决这个问题吗？我在这里附上了CSS代码，请Click here查看网站。

#payment{
    width: 265px;
    border: 1px solid #cecece;
    border-radius: 8px;
    -webkit-box-shadow: 0 2px 7px rgba(50,50,50,0.46);
    -moz-box-shadow: 0 2px 7px rgba(50,50,50,0.46);
    box-shadow: 0 2px 7px rgba(50,50,50,0.46);
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    display: block;
    position: absolute;
    float: right;
    height: 230px;
    padding: 10px;
    left: 549px;
}

Answer 1

这可能是填充问题。 IE 和 firefox 解析填充的方式不同。 Firefox 使用 div 的高度/宽度添加填充(因此总高度/宽度将定义为高度/宽度+填充)，而 IE 不添加它。旧版本 (< IE9) 会出现这种情况。

您可以尝试以下旧版本的 IE。

<!--[if lt IE 9]>
#payment{
    width: 285px; /* original width + padding on left and right */
    height: 250px;/* original height + padding on top and bottom */
    padding: 10px;
}
<![endif]-->