TextMate snippet for clearing floats
I often use positioniseverything.net’s CSS method for clearing floats without structural markup. The code for this technique is not something that I’ve committed to memory yet, so I’m referencing the article all the time (I could just copy it from another project, but it’s just so much quicker to type “css clear float” into google).
Well, positioniseverything.net is about to get several less page hits per week, because I finally threw the code into a TextMate snippet and assigned it the keyword “clearfix”.
${1:.clearfix}:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
$1 {display: inline-block;}
/* Hides from IE-mac \*/
* html $1 {height: 1%;}
$1 {display: block;}
/* End hide from IE-mac */
$0
Update: DRYed up based on Jacob’s comment.