Chrome不顯示空錨定標記

Question

問題： 當錨點標記位於一個範圍內並且在該範圍內存在空格字符時，Chrome似乎無法以左填充和背景顏色呈現空的定位標記範圍內的文本和錨標記。

如果從span範圍內的文本和嵌套的定位標記之間刪除了空格，那麼定位標記將按預期呈現。這

這似乎只會影響鉻。我已經確認在IE和FF中的標記呈現，但還沒有嘗試Safari。

標記：

<span id="container1">asd <a></a></span> 
<br/> 
<span id="container2">asd<a></a></span> 

風格：

#container1 a, #container2 a{ 
    padding-left:17px; 
    background-color:red; 
    cursor:pointer; 
} 

小提琴：http://jsfiddle.net/98ezf/1/

是由PageDown鍵生成的標記。

如何強制chrome渲染嵌套在＃container1中的錨標記？

Answer 1

inline元素不能有填充。 a默認爲display: inline。將其更改爲inline-block。您還需要指定一個高度，或者高度爲0px，即：不可見。

#container1 a, #container2 a{ 
    padding-left:17px; 
    background-color:red; 
    cursor:pointer; 
    display: inline-block; height: 1em; /* or whatever */ 
}

這是sample fiddle。