2010-12-15 63 views
0

我試圖理解爲什麼下面產生的IE/Firefox和Chrome不同的結果:格式差異

<a href="#">ABC <span style="position: absolute;">XYZ</span></a> 

在IE7和Firefox 3.6, 「ABC」 被強調,而「 XYZ「不是,並且它們之間沒有可見的空間,即它們一起作爲」ABCXYZ「運行。

在Chrome 9中,整個字符串帶下劃線,並且它們之間有一個空格,即「ABC XYZ」。

很明顯,他們每個人都以不同的方式處理position: absolute,所以我試圖找出原因。這個例子是從一個絕對定位是必要的代碼塊中提取的,所以我試圖讓IE/Firefox和Chrome看起來都一樣。

我試圖在span上指定text-decoration: none來擺脫「XYZ」上的下劃線,但Chrome只是忽略了這一點。

+0

您已經嘗試了'' 而不是「ABC」後的空白使用時可能有問題?這可能有助於間距問題。 – 2010-12-15 15:57:57

+0

的確如此。不幸的是,我試圖理解下劃線多於間距,因爲我使用絕對定位將跨度恰好移動到我想要的位置。我將間距事件作爲另一個不同瀏覽器如何以不同方式呈現相同代碼的另一個示例,但這絕對是強制間距行爲的一種方式。 – gfrizzle 2010-12-15 16:04:22

回答

1

您是否嘗試過使用display:block;display:inline-block;與span?

position:absolute;inline元素(這是<span>默認)

+0

我用過,但沒有效果。它在Firefox中正常工作,但不在Chrome中。 – Govan 2014-04-08 12:18:29