Padding/Margin/Border On Element Does Not Change DIV Height

Posted by ryandlf on Stack Overflow See other posts from Stack Overflow or by ryandlf
Published on 2012-09-02T20:16:23Z Indexed on 2012/09/02 21:38 UTC
Read the original article Hit count: 167

Filed under:
|

Here is a very simply jsFiddle to demonstrate my problem: http://jsfiddle.net/ryandlf/mSmUv/4/

When an element has a top padding or margin and it sits on the first line within a div, the div does not respect that padding or margin and push the element down. In most cases this isn't an issue, but for example, if I have a button that has a top border and padding the top of the border will be cut off because the div is not taking into consideration the padding value.

Is there a workaround for this other than just blindly setting margins or padding on every container div element and hoping I have added enough to account for any internal element that might be affected?

© Stack Overflow or respective owner

Related posts about html

Related posts about css