IE8与Chrome / Firefox / Opera之间具有Box Model差异的CSS菜单

Question

我以为IE7和更高版本遵循的是与Chrome / Firefox / Opera相同的盒子模型，但是当我在IE8中运行以下代码，然后在Chrome / Firefox / Opera中运行以下代码时，我得到了不同的结果。

在IE8中，框的末端显示了一些我想摆脱的嘴唇。 是否可以使用严格的CSS来解决我的问题，还是需要使用Javascript来检测浏览器，然后更改CSS？

这是我正在使用的代码的链接。 为了查看我的问题，您需要使用IE，然后使用Chrome，Firefox或Opera。

Answer 1

IE7有两种模式：兼容模式和标准模式。 MS在IE方面所做的一系列出色举措中的又一个。 （是的，我很讽刺）：

http://blogs.msdn.com/b/chkoenig/archive/2008/08/28/ie8-standards-mode-and-ie7-compatibility-mode.aspx

通常让人们感到困扰的是，默认情况下，如果页面是在本地加载或从网络上的服务器加载，则IE8会恢复到兼容（即损坏）模式。 我猜想逻辑是它必须是您的Intranet上的一个页面，并且由于所有Intranet Web软件中90％都是用IE6怪诞的方式编码的，因此在任何标准浏览器中几乎都无法解决，因此最好假设代码已损坏并恢复为兼容模式。

至于检测IE8，您可以通过IE的条件注释在不使用JavaScript的情况下进行操作。 我通常要做的是将主体标签包装在条件语句中，并为每个变量赋予唯一的ID：

<!--[if !IE]> -->
    <body>
<!--<![endif]-->
<!--[if gt IE 8]> 
<body id="IE9">
<![endif]-->
<!--[if IE 8]>
    <body id="IE8">
<![endif]-->
<!--[if IE 7]>
    <body id="IE7">
<![endif]-->
<!--[if lt IE 7]>
    <body id="IE6">
<![endif]-->

然后在CSS中，您可以根据需要轻松提供单独的CSS：

.myStyle {for good browsers}
#ie7 .myStyle {fix for IE7}

IE8与Chrome / Firefox / Opera之间具有Box Model差异的CSS菜单

问题描述

1 个解决方案

解决方案1
1 已采纳 2011-11-09 02:12:14

IE8与Chrome / Firefox / Opera之间具有Box Model差异的CSS菜单

问题描述

1 个解决方案

解决方案1 1 已采纳 2011-11-09 02:12:14

解决方案1
1 已采纳 2011-11-09 02:12:14