最大宽度属性导致IE7下菜单背景不显示

Question

我正在使用bootstrap css框架，并建立了一个水平菜单。它在除IE7以外的所有浏览器中都运行良好。我把它缩小到使用max-width属性，它可以防止背景在IE7下显示。以下示例(在IE7中查看):

http://jsfiddle.net/dZRcS/

解决这个问题的最好方法是什么?

Answer 1

menu-containerdiv的目的是什么?这就是在IE7中覆盖颜色的原因。

删除menu-containerdiv，它将工作(http://jsfiddle.net/dZRcS/4/)

如果你需要保留menu-containerdiv，然后从它删除背景色，因为它从来没有见过(http://jsfiddle.net/dZRcS/3/)

Answer 2

IE7在设置max-width时存在问题。如果这是不可避免的，你必须使用它，有一个解决方案:

IE支持它自己的表达式属性，这使我们能够使用JavaScript表达式来操作(X)HTML文档属性，如max-width和max-height。

div {
   width: expression(333 + "px");
}

. .这相当于:

div {
   width: 333px;
}

max-width in IE

此方法已在IE6中验证，应该也适用于IE5。只需更改值以满足您的需要，并通过条件注释包含在文档中。在本例中，对于IE和所有兼容标准的浏览器，max-width为777px 1:

* html div#division { 
   width: expression( document.body.clientWidth > 776 ? "777px" : "auto" ); /* sets max-width for IE */
}
div#division { 
   max-width: 777px; /* this sets the max-width value for all standards-compliant browsers */
}

来源:http://perishablepress.com/press/2007/01/16/maximum-and-minimum-height-and-width-in-internet-explorer/