解决IE7下display:inherit宽度不自适应的问题

2010-12-02 16:08:24来源:西部e网作者:icech

今天偶然间用IE7访问了一下我的网站,发现网站写了display: inherit的ul块竟然是空白的。用IETester的DebugBar调试了一下代码,发现ul竟然被挤到一边去了。但是在IE6、IE8、Firefox、chrome等等浏览器都是正常的。

今天偶然间用IE7访问了一下我的网站,发现网站写了display: inherit的ul块竟然是空白的。用IETester的DebugBar调试了一下代码,发现ul竟然被挤到一边去了。但是在IE6、IE8、Firefox、chrome等等浏览器都是正常的。

查看了一下代码,是这样写的:

.li_word {
    display: inherit;
    padding: 4px 0 3px;
}

我用IE8浏览器的“兼容性视图”访问了一下网站,发现也有这个问题。

针对于IE8是非常好解决的,只要在页面顶部增加一个

<meta http-equiv="X-UA-Compatible" content="IE=8" />

就可以了,强制开启IE8的标准渲染模式,而不使用IE7的兼容模式。

当我在使用搜狗高速浏览器兼容模式测试访问网站也是如此,看样子搜狗的兼容模式其实就是IE7的兼容模式。但是360和遨游等却都已经默认是IE8的标准渲染模式,不知道搜狗是怎么想的。

虽然IE7用的人已经非常少了,但是还是要考虑到,所以总要解决之。

最终的解决办法:

里面没有写width,加上了width: 100%调试一下,发现正常了。

.li_word {
    display: inherit;
    padding: 4px 0 3px;
    width: 100%;
}

这可能是IE7的一个BUG,也可能是俺书写的不规范?总是就是这样解决了 :(

赞助商链接: