Magic clear:both trick in pure CSS

http://theosom.com/p/DSgI

by MadRabbit • 14 years ago

5 11 14 years ago

theosom.com

jonah• 14 years ago

Unfortunately, the :after pseudo-selector has limited support. :(

MadRabbit4• 14 years ago

it works in IE8, everything below it should die in pain

actually, IE8 should die in pain as well :)

Keithamus• 14 years ago

Problem is the word "should", which isn't "has". Which means this trick doesn't help those of us who have to support IE<=7

shdon• 14 years ago

Setting overflow:hidden on the container div works all the way back to IE6. The caveat there is that any actual overflow is hidden, which may be unexpected. Things like box-shadows and absolutely position children.

dutchbrit• 14 years ago

Indeed, that's what I've been using.

MadRabbit4• 14 years ago

i believe you also can set `{ *zoom: 1}` on the container block, that should also work in old browsers and it doesn't cause hidden scrolls

beerweasle2• 14 years ago

clearfix?

Boldewyn• 14 years ago

Yay! Someone finally invented the clearfix method!

Or wait, hasn't someone else done that before?

My personal favorite: http://nicolasgallagher.com/micro-clearfix-hack/

MadRabbit4• 14 years ago

Yay! Someone finally invented the being a dick attitude!

http://fatkidatcamp.com/wp-content/uploads/2009/11/youre-a-d...

Magic clear:both trick in pure CSS

Related Stories