IE7 的 CSS 问题答案

【问题标题】：CSS trouble with IE7IE7 的 CSS 问题
【发布时间】：2010-09-13 02:22:46
【问题描述】：

我正在设计一个网站，它在除 IE7 之外的所有浏览器中看起来都不错，但我遇到了无法纠正的问题。我有一个这样的 HTML 菜单：

<div id="nav">
        <ul>
            <li id="cMenu"><a id="cart" href="#">Home</a></li>
            <li id="pMenu"><a id="promos" href="#">Promos</a></li>
            <li id="aMenu"><a id="anun" href="#">Ads</a></li>
        </ul>
    </div><!-- /nav -->

然后我有我的 CSS：

div#nav{width:339px;height:120px;display:block;}

div#nav ul{list-style:none;}
div#nav ul li{display:inline;padding:20px;}
div#nav ul li a{width:30px;height:80px;}

div#nav ul li#cMenu{text-indent:-999999px;}
div#nav ul li a#cart{background:url(../img/menu2.png) 0 50px no-repeat;width:110px;height:120px;display:block;}
div#nav ul li a#cart:hover{background:url(../img/menu2.png) 0 -69px no-repeat;}

这里的问题是，当我在 IE7 上预览时，什么都没有显示，我已经厌倦了绝对定位，还通过使用 border="dotted" 检查是否一切都在那里，我只能看到 div 的边框#导航，没有其他显示。（我没有放置菜单的所有css，因为它基本上相同，只是id不同）。

有人知道怎么回事吗？

【问题讨论】：

您使用的是文档类型，您是否尝试过display: block; 的li 元素（以确保它们正在被渲染）？还要确保您已关闭文档的<head> 中的任何/所有script 和style 标签。
是的，我正在使用 ttp://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" rel="nofollow" target="_blank">w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 并且它验证了。我检查了所有的标签，它们都关闭了显示：块我没有尝试过，但是当我尝试时，它出现了，非常感谢！

标签： html css internet-explorer-7

【解决方案1】：

使用

display: block;

为您的 CSS 导航声明。那应该可以解决它:)

【讨论】：

【解决方案2】：

div#nav ul li#cMenu{text-indent:-999999px;}

通过这个它将所有内部的li标签发送到-9999999 text-indent

尝试将文本缩进添加到 a 标记

我希望它有效

【讨论】：