2011-04-14 77 views
1

這是一個奇怪的選擇。 http://www.madebypaz.com/profile上的<OL>使用:before僞元素作爲圖表的註釋(ABC和圖像)。我用adjecent同胞選擇這個像這樣:相鄰的兄弟選擇器和:Chrome 10中的僞元素之前

#profiletext ol li:before { 
    content: 'A'; 
    } 

#profiletext ol li+li:before { 
    content: 'B'; 
    } 

#profiletext ol li+li+li:before { 
    content: 'C'; 
    } 

#profiletext ol li+li+li+li:before { 
    content: ''; 
    } 

#profiletext ol li+li+li+li { 
    background: url('/wp-content/themes/paz2010/images/sweet-spot.png') no-repeat; 
    margin-left: 0; 
    padding-left: 38px; 
    } 

#profiletext ol li { 
    height: 30px; 
    margin-left: 10px; 
    } 

這可能不是最完美的解決方案,但直到有人向我指出的,它打破在Chrome 10在Chrome中它在所有瀏覽器完美工作包括Chrome 10它會顯示AAA並在您將鼠標懸停時更改爲正確的字符。這很奇怪,因爲甚至沒有定義懸停樣式!

下面是這個屏幕記錄:http://cl.ly/0E170v1Z0O2E0f3F0j0d

爲什麼發生這種情況,我該如何解決?有沒有更好的方法來達到相同的結果?

任何指針非常感謝!

+0

聽起來像一個Chrome 10的bug。 – BoltClock 2011-04-14 17:13:57

+0

我遇到過類似的問題;也僅限於chrome,但是作爲'〜'和':before'選擇器之間的交互。 – 2011-05-19 15:46:21

回答

0

這在Chrome 16上按預期工作 - 需要進行簡單更新。

+0

糟糕,看起來像您已經制定了解決方法,而不是上面引用的代碼。 – 2011-12-12 16:51:10