Question

在设计和编码符合标准的网站后，在普通浏览器（Firefox，Chrome等）中功能正常，我现在需要在Internet Explorer中使其看起来相同（或大部分都是这样），直到Internet Explorer 6。

该网站的当前版本可在http://www.adwas.org/test/redesign/找到，http://jsfiddle.net/FdS6L/

的问题的最小版本

我遇到的问题是在带有徽标的区域及其下方，它在IE6中完全崩溃（而且，7，我猜，仍然）。我已经尝试使用星形黑客选择器来解决一些问题，尽管它仍然看起来很严重。我的问题是：如何保持标题的大小，并使元素（有些，如果不是完全）可见，类似于它在大多数浏览器中的外观？

注意：

我并不反对在IE6中根据需要为布局添加JavaScript。（主要适用于子菜单导航）

Answer 1

我正在尝试在您的网站上工作，并且达到了这一点：http://jsfiddle.net/3m367/3/。我基本上清理了一些代码并重新构建了标题，其中条形是自动宽度而不是强制（overflow-x是CSS3属性，因此对旧版浏览器不起作用）。这在IE7及以上版本中显示正常。但是，我偶然发现导航问题 - IE6仅在:hover元素上支持a伪类，因此像li:hover这样的选择器不起作用。但是，您不能将子菜单放在父菜单项的a元素中，因为您不能在链接中包含链接。我不确定是否可以在不使用JavaScript的情况下在IE6中执行该下拉菜单。除此之外，导航似乎是IE6中唯一搞乱的东西。

Answer 2

您可以尝试使用float: left而不是#sitenav li：

#sitenav {
    display: table;
}

#sitenav ul {
    display: table-row;
}

#sitenav li {
    display: table-cell;
}

您还应该考虑使用conditional comments隐藏其他浏览器中的一组仅限IE的样式表，尤其是针对IE6旧版和旧版的样式表。如果你没有得到任何与CSS和条件评论一起使用的东西，你应该考虑尝试HTML5 Shiv并使用HTML5进行标记（我相信你应该这样做）。

IE 6中的站点标题兼容性，使用浮动和绝对定位

注意：

2 个答案: