Html 基于webkit的浏览器上的css图标诡计怪异行为_Html_Css_Webkit_Background Image

Html 基于webkit的浏览器上的css图标诡计怪异行为

html css

Html 基于webkit的浏览器上的css图标诡计怪异行为,html,css,webkit,background-image,Html,Css,Webkit,Background Image,我的问题最好用html代码来解释： <html><body> noicon <a href="http://www.stackoverflow.com" style="padding-left:20px; background: url(http://cdn.sstatic.net/stackoverflow/img/tag-adobe.png) no-repeat center left;"></a> <br /> icon <

我的问题最好用html代码来解释：

<html><body>
noicon <a href="http://www.stackoverflow.com" style="padding-left:20px; background: url(http://cdn.sstatic.net/stackoverflow/img/tag-adobe.png) no-repeat center left;"></a>
<br />
icon  <a href="http://www.stackoverflow.com" style="padding-left:20px; background:     url(http://cdn.sstatic.net/stackoverflow/img/tag-adobe.png) no-repeat center left;"></a>
</body></html>


诺伊孔


偶像

这是通过css添加图标的常见技巧。但是，在mac os x（chrome 9和safari 5）上基于webkit的浏览器中，当前面只有一个空格时，图标不会显示。是否有人知道如何使链接背景图像在

前面不带两个空格（？？？）的情况下显示？

在链接内部放置一个零宽度的空格


<a href="http://www.stackoverflow.com" style="padding-left:20px; background: url(http://cdn.sstatic.net/stackoverflow/img/tag-adobe.png) no-repeat center left;">&#8203</a>


您是否尝试过在a
元素上使用display:inline block
？好的，这是另一种解决方法，但这是已知的文档行为吗？为什么这种情况会发生在webkit浏览器中而不是其他浏览器中？