填充/保證金/邊框的元素不會改變DIV高度

當一個元素有一個頂部填充或保證金，坐在第一行一個div內，div不尊重該填充或邊距並將元素向下推。在大多數情況下，這不是問題，但例如，如果我有一個具有頂部邊框和填充的按鈕，邊框的頂部將被截斷，因爲div沒有考慮填充值。

除了在每個容器div元素上盲目設置邊距或填充以及希望我已經添加了足夠的空間來解決任何可能受到影響的內部元素之外，是否有解決方法？

2012-09-02 ryandlf

與類按鈕的鏈接不是block元素，它是inline元素。通過向其添加dispaly: block來更改此默認行爲，它將按預期工作。證明可在jsfiddle上找到。

所以總結一下，問題不在於div - 這是css的問題 - 內聯元素忽略邊距和填充，因爲它們不能「保留空間」。

UPDATE：要回答你的評論，你here is the solution可能會尋找

2012-09-02 20:21:45 mkk

如何在這種情況下設置寬度以適合文本？ – ryandlf

不要介意...內聯塊。 – ryandlf

向左浮動意味着div中的所有內容都必須具有浮動元素，否則將無法正確定位。內聯塊的工作原理非常完美，但IE7有沒有解決方案？ – ryandlf

按鈕元素是inline。要獲得所需的行爲，您可以設置display:inline-block。檢查here

2012-09-02 20:27:28 heretolearn

嘗試添加下列到父DIV：

溢出：隱藏

我希望它能幫助！

2012-09-02 21:34:13 nodesto

回答