IE盒模型錯誤

Question

我有一個頁腳，文本區域下方，包含列表並與編號份額出頭的一個div內的兩個按鈕（所有內聯）。由於某些原因，它在Internet Explorer中放置方式不同。我希望它在IE中看起來和Chrome中一樣。我究竟做錯了什麼？ http://jsfiddle.net/h3twR/

Answer 1

奇怪的是，IE7似乎是爲我好，但是8 & 9關閉。如果您有（使用條件註釋）的IE-只有樣式表，你可以補充一點：

#share-something-container textarea { 
    margin-bottom: 5px; 
} 

*:first-child+html #share-something-container textarea { 
margin-bottom: 0px; /* targets ie7 and undoes the margin above, as IE7 is okay */ 
} 

這並不能解釋爲什麼不同的行爲，但我早就放棄了尋找邏輯和原因在IE中。

Answer 2

似乎有某種IE8/9和其他瀏覽器和他們是如何渲染文本區域之間的差異。

它看起來像你只需要設置TEXTAREA顯示塊。看起來有些瀏覽器在這種情況下行爲不同，因爲它們會將所有元素視爲內聯並生成額外的空白空間。但是，將其設置爲顯示：內聯似乎沒有相反的效果，所以它很奇怪。

這裏有一個解決方案：

http://jsfiddle.net/h3twR/2/

我只是添加了這個：

#share-something-container textarea { 
    ... 
    display:block; 
    margin-bottom:5px; 
} 

而且它似乎更一致渲染。 IE7似乎更多一點。但希望這會有所幫助。

乾杯！