This is content with margin
How can I add padding to an element without adding on top of the predefined width?
It\'s good to define the width of a column to make a clean grid for the layout; bu
Everytime you add padding to block element, the width of this element changes. This problem has many solutions. I usually set margin
to first child element and set width: 100%
for this element.
For example, we have:
This is content with margin
CSS style for these elements:
#main {
border: solid 1px red;
float: left;
width: 5em;
}
#child {
border: solid 1px blue;
float: left;
width: 100%;
margin: 0.5em;
}
This is a solution for any browser