刪除內聯span元素的填充

我有兩個內聯元素。你可能會認爲它們完全一樣，除了一個位置被設置爲絕對位置並且它位於另一個之下。就像這樣：刪除內聯span元素的填充

<body style="text-align: center;"> 
<span style="background-color: #000; color: white; font-size: 300px; line-height: 1; padding: 0; position: relative;"> 
    AAA <span style="background-color: #333; color: white; font-size: 300px; line-height: 1; padding: 0; position: absolute; top: 100%; left: 0;">AAA</span> 
</span> 
</body>

小提琴：http://jsfiddle.net/CSPFL/5/

，當然，全屏小提琴：http://jsfiddle.net/CSPFL/5/show/

的跨度是不一樣的高度！靜態跨度有某種填充。是否有可能刪除此填充，而不會將位置更改爲絕對？提前致謝！

編輯：你可以看到他們是不一樣的高度，如果你左變100％和頂10％。對於Mac來說，他們似乎是FF的高度。

來源

2012-02-02 bopjesvla

小提琴URL不起作用（404）。如果省略「_bop /」部分，他們會工作，但是他們是否會引用您的最新版本？ – 2012-02-02 22:49:41

我已經改變了Royi的例子，我忘了完全替換超鏈接...是的，這是最新的版本。 – bopjesvla 2012-02-03 12:59:15

這似乎是對齊兩個元素的一種非常奇怪的方式。 – MetalFrog 2012-02-03 13:03:18

試試這個：

<span style="background-color: #000; color: white; font-size: 300px; padding: 0;float:left;">AAA</span> 
<span style="background-color: #000; color: white; font-size: 300px; padding: 0; position: absolute;float:left;">AAA</span>

http://jsfiddle.net/CSPFL/1/

來源

2012-02-02 20:29:40

對不起，但它不起作用。我詳細闡述了這個例子... – bopjesvla 2012-02-02 20:46:07

這個問題可以分離取決於position: absolute。只需將其添加到span的規則line-height: 1即可改變其外觀。這取決於不同類型的元素的不同高度計算算法（CSS的棘手的一面）。

由於您的問題是，非定位span太高，這可能有助於它在渲染變成一個塊級元素（或內聯塊）：添加

display: block

或

display: inline-block

爲span。

來源

2012-02-03 14:42:52

真的嗎？你必須在沒有閱讀的情況下回答（或者你剛剛從我的評論中複製了答案）。無論哪種方式，我在15分鐘之前就明白了。 – bopjesvla 2012-02-03 14:55:34

刪除內聯span元素的填充

回答

相關問題