帶有背景圖像按鈕的IE 7顯示問題

在頁面的最底部，三個閱讀更多按鈕在IE 7中無法正確顯示。爲什麼會這樣？我已經嘗試了一切！帶有背景圖像按鈕的IE 7顯示問題

http://tjonesandson.co.uk/

.readmore { 
    background-image: url("images/readmore-left3.png"); 
    display: block; 
    float: right; 
    height: 24px; 
    margin-top: 10px; 
} 

.readmore a { 
    background: url("images/readmore-right3.png") no-repeat scroll right center transparent; 
    color: #414040; 
    display: block; 
    float: right; 
    font-family: Arial; 
    font-size: 11px; 
    height: 21px; 
    margin-right: -15px; 
    padding: 3px 10px 0; 
    text-shadow: 1px 1px 0 #FFFFFF; 
}

來源

2010-09-02 Solidariti

這裏有XP/SP3 + IE7，看起來和Win2k3 + IE8一樣。你看起來怎麼樣了？ – egrunin 2010-09-02 14:04:38

-2

嘗試使用嚴格的，而不是過渡...過渡也好不了多少（如果不一樣）怪癖模式。

來源

2010-09-02 12:33:29 Zoidberg

不，不是。只要'doctype'有效，它就會觸發標準的合規模式。 – 2010-09-02 12:35:46

好的我已經插入<！DOCTYPE html PUBLIC「 - // W3C // DTD XHTML 1.0 Strict // EN」「http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd」> 但IE 7仍然在按鈕上顯示溢出。 – Solidariti 2010-09-02 12:43:40

你嘗試過overflow：hidden;？ – Zoidberg 2010-09-02 12:49:04

你可以試試這個。設置一個內聯塊的顯示（您可能需要降低填充，頂部和底部）

.readmore a {display:inline-block;}

來源

2010-09-02 13:26:15 jerjer

如果您在a標籤則能解決您的問題添加display: block。內聯元素通常不具有垂直填充，這就是爲什麼它在IE中看起來不同。您必須通過將其更改爲塊級元素來使其行爲。添加display: block將解決它。

來源

2010-09-02 16:46:11 Qasim

帶有背景圖像按鈕的IE 7顯示問題

回答

相關問題