Float. CLEAR!
Methods for Containing Floats
- Use overflow:hidden with a set width. (width:100%) OR overflow:auto
- If floating left, float another element right to clear.
- :after with IE hacks…
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
Resources:
- www.sitepoint.com : simple-clearing-of-floats
- www.ejeliot.com : blog/59