Posted By

chrisjlee on 06/22/09


css clearfix layout

Versions (?)

Clearfix with different layout classes

 / Published in: CSS

Clearfix with 2 different classes: page, section

Section: takes up a whole row (much like TR); Page: is the container for each section

  1. .clearfix:after, .section:after, .page:after{content:"."; display:block; clear:both; visibility:hidden; line-height:0; height:0} .clearfix, .section, .page{display:inline-block} html[xmlns] .clearfix, html[xmlns] .section, html[xmlns] .page{display:block} * html .clearfix, * html .section, * html .page{height:1%}
  3. .section { width: 100% }
  4. .page { /* DEFINE WIDTH */

Report this snippet  

You need to login to post a comment.