Finally understand CSS Clear Fix

Clear Fix is for FF, not IE. I will explain this.

IE wrongly interpret CSS box model and will enlarge outer block div by it’s inside elements. Event you set those inside elements float style.

On the contrary, FF outer block will not be enlarge if insdie blocks are set to float.

Why do I/we want to know this? for me, it is because my footer element. Content blocks set to float left, left, right is a common practice for three columns web page. This will cause your footer element float to the top of your web page. To fix this, add clear:both to the last block elemnet inside.

Advertisements

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s