CSS間距使用：before僞屬性

Question

我有一個圖像，我試圖使用：之前。我希望圖像坐在線條的第一個字母上。如果你看看現場，鳥的腳應該碰到字母「C」。 它在小提琴中工作，但不在現場。任何幫助？

http://imip.rvadv.com/index3.html

小提琴：http://jsfiddle.net/imakeitpretty/yV3kK/30/

Answer 1

考慮加入

.st-accordion ul li > a{ 
    line-height:27px; 
    ... 
} 

和更新如下：

#chirp:before { 
    ... 
    margin-bottom:0; 
    ... 
} 

Answer 2

#chirp:before{ 
margin-bottom:-20px; 
} 

目前，下邊距設置爲-10px;

希望它有幫助！

Answer 3

您在jsfiddle和您的測試網站上使用不同的基礎CSS。

例如，字體家族已經不同，所以你不能真正比較兩者。

無論如何，設置margin-bottom到-20px在#chirp:before解決您的問題。

Answer 4

你可以嘗試ositioning的：元素之前，絕對：

http://jsfiddle.net/yV3kK/31/

#chirp:before { 
    content:url(http://imip.rvadv.com/images/chirp-bird.png); 
    padding:0; 
    display:block; 
    width: 77px; 
    height: 50px; 
    position: absolute; 
    top: -44px; 
    left: -35px; 
} 

#chirp{ 
    position:relative;  
} 

Answer 5

貌似line-height問題給我。嘗試將其設置爲36px（與您的字體大小相同）。我不確定爲什麼發生這種情況，但我懷疑文本的行高在您的網站和JSFiddle上不同。