Why is “padding” moving my DIV containers?
GOD DAMN IT !!!
I don’t get it. I thought padding was the distance between the inner div and the text.
"The padding clears an area around the content (inside the border) of an element." http://www.w3schools.com/css/css_padding.asp "A padding is the space between an element's border and the content within it." http://www.tizag.com/cssT/padding.php So why is it increasing the size of the div tag? Internet Explorer, Firefox anybody?
Here is the work around but frankly this is stupid.
1. Using a <p> tag within your DIV
<div> <p style="padding:10px"> </p> </div>
2. Using a Div within a Div
<div> <div style="padding:10px"> </div> </div
Per Stuffs that i found online the width and the height of div tags can be calculated using the formulas below: width = border-left + padding-left + width + padding-right + border-right height = border-top + padding-top + height + padding-bottom + border-bottom