CSS浏览器兼容性问题

我最近为客户设计了一个Web应用程序.我使用CSS作为应用程序的布局.我在IE7,Mozilla 3.0.1,Google Chrome 2.0.xxx,Safari 3.1和Opera 9.51上测试了布局.

它们都正确显示没有问题.在交付应用程序后,我的客户发现它与IE6存在兼容性问题.该网站未正确显示.

我该如何解决这个问题？我的系统上没有IE6甚至尝试修复它.每当我尝试将浏览器降级到IE6时,IE将停止工作.有没有办法可以获得一个可以在线模拟IE6的环境.

其次,正在利用css框架来解决兼容性问题,即使我想使用css框架,哪一个更好地与蓝图css分开.

谢谢你的时间.

IE6处理CSS的方式是一种已知的灾难.您最好的选择是使用虚拟机或具有IE6的旧系统并将其用于测试.但是,有一些不错的工具可以在很大程度上模仿IE6.我最喜欢的是IETester.在browsershots.org上有一个在线工具也不错,但我发现它有时并不一致.

您最好的方法是创建一个仅适用于IE6的单独样式表,并使其余的CSS处于工作状态.您可以在HTML中使用以下内容加载仅限IE6的样式表:

一旦加载,您就可以开始覆盖IE6中存在问题的常用样式.

我有一种感觉,你正在遇到一个盒子模型问题,因为你在Quirks模式下渲染.IE7 +和所有其他浏览器使用W3C盒模型,而IE6 在怪癖模式下使用IE Box模型.

该IE盒模型(称为传统的盒模型),包括一个元件的宽度/高度填充和边界.

在IE盒子模型下,宽度为100px,每边2px填充,3px边框和每边7px边距的盒子将具有114px的可见宽度.

的W3C盒模型(这是标准盒模型),从排除了一个元件的宽度/高度填充和边界.

在W3C盒型号下,宽度为100px,每边2px填充,3px边框和每边7px边距的盒子的可见宽度为124px.

Box Models http://www.456bereastreet.com/i/box-model.gif

为了使IE使用W3C盒模型(这是其他浏览器使用的模型),您的页面需要以严格模式呈现.默认情况下,IE以Quirks模式呈现.

要在IE中触发严格模式,您必须指定doctype.您可以使用以下任何doctypes:

HTML4严格:

XHTML 1.0严格:

XHTML 1.0 Transitional:

您的doctype必须是首页出现在您的页面上.它甚至在标签之前,在它自己的线上.(添加prolog将导致IE以Quirks模式返回,因此如果有的话,请将其删除).

有关Quirks/Strict模式的更多信息,请访问:

CSS - Quirks模式和严格模式

虽然在切换标准模式中添加文档类型可能无法解决您的所有问题,但您至少会朝着正确的方向迈出一大步.