2011-02-15 73 views
2

IE9 rendered image如何設置像標籤或跨度這樣的內聯對象的垂直對齊方式,設置文本對齊等於IE7-8的中心?

上圖是用於過濾我網站中某些數據的HTML。我在這個文本中有2個標籤和2個選擇對齊中心線。所有元素都以內聯方式顯示。在IE9 RC和Chrome 9上,一切都完美無缺。但它不適用於IE7和IE8,因爲所有標籤中的文本都顯示在底部,如下圖所示。

IE7 rendered image

你有這個問題的任何CSS?你可以編輯我的jsFiddle來試圖解決這個問題。

http://www.jsfiddle.net/AaDkd/

更新#1 我嘗試設置與當前行的高度相關的所有元素的行高。但它不適用於IE7。

enter image description here

的源代碼:http://jsfiddle.net/AaDkd/1/

演示:http://fiddle.jshell.net/AaDkd/1/show/

更新#2

enter image description here

正如你看到的,我刪除所有樣式的控制,但垂直-C在使用IE7時,在選擇和標籤中輸入的文本不完全相同。這是因爲選擇的默認高度(在IE7中無法調整)以及標籤或跨度的高度不相等。

源代碼:http://jsfiddle.net/AaDkd/5/

演示:http://fiddle.jshell.net/AaDkd/5/show/

PS。不要忘記這條線的文本對齊是中心的。

感謝,

回答

3

在你的例子來看,下面的CSS工作適合我在IE8,FF,Chrome瀏覽器。

label, select, button { 
    vertical-align: middle; 
} 

更新:我檢查出來的IE7,如果你不設置這些線路的高度和高度的東西的選擇,它工作正常。唯一的問題是,你無法改變IE7中選擇的高度,因爲在我看來。

UPDATE2:這是怎麼了你的更新#2小提琴顯示我在IE7:

Fiddle screenshot

+0

它不能在IE7工作。抱歉。 – 2011-02-15 13:37:43