Question

我在某些版本的Internet Explorer中遇到以下代码问题：

#iconautente{ 
background-image:url('/style/images/spritecommon.png'); /*icona_utente.png*/
background-position:-117px -15px;
text-indent:-9000px;
width:20px;
height:23px;
display:inline-block;
}

<a id="iconautente" href="/admin/index.php">admin</a>

在Vista下的Firefox，IE7和IE8中，我看到了背景，没有正文，正如预期的那样。在XP下的IE6和IE8中，整个图像是缩进的，而不是文本，因此图像不会显示。

什么应该是正确的行为？有解决方法吗？

Answer 1

也许你可以尝试这样：

.blk {  display:inline-block; height:96px; width:96px; text-indent:-9999px; *text-indent:0; *font-size:0; *line-height:0; *overflow:hidden; }

参见演示http://jsfiddle.net/zhiyelee/4aRZa/

Answer 2

~~大概是~~ Internet Explorer在7以下的版本中不支持display: inline-block;，只在7中支持部分。为什么不使用display:block;？

Answer 3

* html #iconautente{text-indent:0; line-height:0; font-size:0; overflow:hidden}/*ie6 hack */

*:first-child+html #iconautente{ text-indent:0; line-height:0; font-size:0; overflow:hidden}/*ie7 hack */

display：inline-block和text-indent

3 个答案: