advanced code snippet search

Posted By

rickygri on 08/07/12


Tagged

clear html clearfix


Versions (?)

Who likes this?

2 people have marked this snippet as a favorite

firstpass
tux-world


Clearfix

 / Published in: HTML
 

URL: http://www.webtoolkit.info/css-clearfix.html

The problem happens when a floated element is within a container box, that element does not automatically force the container’s height adjust to the floated element. When an element is floated, its parent no longer contains it because the float is removed from the flow.

Expand | Embed | Plain Text 
  1. .clearfix:after {
  2. 	content: ".";
  3. 	display: block;
  4. 	clear: both;
  5. 	visibility: hidden;
  6. 	line-height: 0;
  7. 	height: 0;
  8. }
  9.  
  10. .clearfix {
  11. 	display: inline-block;
  12. }
  13.  
  14. html[xmlns] .clearfix {
  15. 	display: block;
  16. }
  17.  
  18. * html .clearfix {
  19. 	height: 1%;
  20. }

Report this snippet  

You need to login to post a comment.