在CSS中，我可以排列行內塊的高度嗎？

我認爲通過將邊距設置爲0並將高度設置爲自動，該塊將擴展以適應可用空間，但仍然緊密地圍繞該塊。

.myclass { 
    display: inline-block; 
    margin: 0em; 
    padding: 1em; 
    height: auto; 
    border: solid; 
}

我想兩個框是相同的高度，但要在div寬度/高度，以通過它們的內容來確定，而不是指定在像素的寬度/高度。

是否有某種填充/邊距/對齊CSS或類似的東西，我可以使用？

2012-06-23 Steve Hwan

如果你需要一個純粹的CSS解決方案，你可以使用display:table-cell;，但要注意它不能在IE7中工作（我猜IE6現在已經被完全忘記了）。

.myclass { 
    display: table-cell; 
    margin: 0em; 
    padding: 1em; 
    height: auto; 
    border: solid; 
}

實現你需要的是JavaScript的明確不過設置與動態內容的容器的寬度最好的方法是幾乎總是錯誤的方式。

2012-06-23 23:13:24 brezanac

無論如何，'inline-block'對IE7中的塊元素不起作用，所以我猜IE7支持是不需要的。 – BoltClock

那麼確定我只是提出選項。 – brezanac

表格單元格很吸引人（可以在表格外部使用嗎？），但是有沒有辦法在.myclass塊之間保留空格？當我切換到表格單元格時，它摺疊了間距，並且添加邊距似乎沒有在邊框線之間獲得任何空間。 http://jsfiddle.net/6NQDw/18/ –

您可以使用display: table-cell;使箱子與彼此的高度相匹配。

2012-06-23 23:14:09 exobrain

如果您想要支持IE7，則不能使用內嵌塊或表格單元格。

只需使用浮動：左是安全的......

否則你將土地利用起來只爲IE7一個單獨的CSS。

2012-06-23 23:44:32 Geocrafter

我不認爲浮子達到相等的高度。 http://jsfiddle.net/6NQDw/17/ –

如果你知道在兩個盒子裏面會發生什麼，那麼你可以將「高度」添加到「myclass」中。但是，如果您希望盒子內的內容可能發生變化，那麼這將是IE7中需要解決的問題。 – Geocrafter

-1

它很容易爲lte ie8添加樣式表，重置屬性以顯示：block，float：left，並使總寬度超出99％而不是100％。這將爲您提供所有必需的功能。

2014-10-28 17:43:49 user3686007

所以我們共享代碼，你可以編輯你的答案，因此它的範圍是原來的海報問題？ – Anthony

回答