0

在一个html页面支持这些浏览器Mozilla Firefox14、IE8、Safari5.1.1、Chrome19。由于要支持所有这些浏览器,我必须使用 css hack 来保持页面上元素的正确对齐。

下面是css:

对于 Mozilla Firefox 和 IE8:

.dis_stats
{
position:absolute;
margin-top:-30px;
margin-left:-190px;
background:#E0E0E0;
width:141px;
height:80px;
_position:relative;
_margin-top:-460px;
_margin-left:115px;
}

对于 Safari 和 Chrome:

@media screen and (-webkit-min-device-pixel-ratio:0) {
.dis_stats
{
position:absolute;
background:#E0E0E0;
margin-top:-30px;
margin-left:731px;
width:141;
height:80;
}
}

现在 Mozilla 上发生的事情正在完美运行。但在 IE8 上,它正在应用为 Safari 和 Chrome 定义的属性,如果我删除任何 Safari 和 Chrome 的属性,那么它将从预期的属性中选择相同的属性(即为 IE8 和 Mozilla 定义的)。

我不知道为什么会发生这种情况。有人请建议这里有什么问题吗?

4

1 回答 1

0

我建议尝试制定一个符合标准且不需要 hack 的版本。但是如果你必须破解,你可以考虑专门为 IE 8 使用单独的样式表来修复其问题的条件注释:

<!--[if lt IE 8]>
<style type="text/css" src="path/to/ie-only-style.css">
<![endif]-->

这并不能真正解释 IE 的问题,但可以解决一些特定于 IE 的问题,而无需花费太多时间(以可维护性为代价)。

于 2014-01-15T01:57:39.953 回答