IE瀏覽器的CSS填充左只是填充文本的第一行

我正在通過我的樣式表試圖使我的CSS友好的IE瀏覽器，我遇到了一個問題，因爲我的填充左由於某種原因。它僅在我的'span'標籤中將填充應用於第一行文本。當文本運行到下一行時，它會一直延伸到'span'元素的左側。IE瀏覽器的CSS填充左只是填充文本的第一行

（無法顯示NDA目的截圖）

瀏覽器：IE7

CSS：

#rightContent .rightNav a,#rightContent .rightNav a:visited{ 
    color:black; 
    display:block; 
    width:92px; 
    padding-right:12px; 
    height:35px; 
    background:url("../images/nav_off.png"); 
} 
#rightContent .rightNav span{ 
    display:table-cell; 
    vertical-align:middle; 
    height:28px; 
    padding-left:13px; 
    font-size:9px; 
}

HTML：

<li> 
    <a href=""> 
    <span>This text is too long.</span> 
    </a> 
</li>

來源

2011-07-28 Chris

難道你不能申請填充？或者顯示爲塊？ – MatTheCat

IE7不支持display: table-cell ：http://caniuse.com/css-table

如果僅用於IE7，您將不得不尋找替代技術。

嘗試將*float: left添加到span - 它會將only apply更改爲IE7及更低版本。也許這將是一個「足夠好」的修復。

看起來您正在使用display:table-cell; vertical-align:middle進行垂直居中。如果它是絕對至關重要的在IE7中有這樣的情況，它可以不訴諸於JavaScript，但它是一個痛苦的屁股。

來源

2011-07-28 14:30:29 thirtydot

啊，我錯過了'display：table-cell'部分。 –

它似乎類似於這裏問的問題：Why Doesn't IE7 recognize my css padding styles on anchor tags?我不確定它爲什麼這樣做，它似乎是一個IE錯誤。我建議將文字包裝在其他東西（div或p標籤）中，或者將文本直接放在a標籤中，如果您需要特定樣式，則只需給a標籤添加一個類。

來源

2011-07-28 14:39:20

IE瀏覽器的CSS填充左只是填充文本的第一行

回答

相關問題