Jump to content

Alternate clearing method to clearfix?


Recommended Posts

Today I had to use an alternate clearing method. Typically I use overflow: auto; which works like a charm. However, this time I had to overlay an image that want out of its parent's container. This mean overflow: auto; would crop the image out at the border.


I ended up using the true clearfix method as an alternate. It seems to work, but I'm a bit skeptical. Some of the other elements on my webpage became puking scrollbars out. It seems like clearfix isn't as foolproof as some say it is.


So my question - is their an alternate to clearing aside from clearfix and overflow: auto;?

Link to comment
Share on other sites

Yes, overflow:hidden. Clearfix doesn't generate scrollbars under any circumstances whatsoever.


But, I know what TFG is asking for, and yes there are other alternatives.


Here is an Eric Meyers article from 2003. Keep in mind he wrote this while most of us were still using tables and "layers" and IE 5.5 was still the top browser. His first solution is no big surprise and all of us tried this without even knowing what it was.


It was his second solution, the "use a float to fix a float" that created a buzz and is what some experts still recommend after the clearfix.



Link to comment
Share on other sites

I don't quite understand why eric meyer is hailed as an expert css developer. The idea behind "use a float to fix a float" is so basic and rudimentary that it makes me cringe to think that Meyer is exulted as an expert for this. I have always did this, without every knowing it was an advanced technique.


If you ask me, the geniuses at W3C should stop worshiping Meyer and create some truthfully useful css properties. - stop creating useless - "box-shadow" and "text-shadow" features which could be easily implemented through basic backgrounds. Give me an option to clear all childs within a parent.


clear-child: both;

Link to comment
Share on other sites

The idea behind "use a float to fix a float" is so basic and rudimentary that it makes me cringe to think that Meyer is exulted as an expert for this.


LOL. You DID notice that the article was written in 2003. In 2003 floats were extreme cutting edge stuff. Don't forget, IE 5.5/win and IE 5.1x/Mac were the 90% marketshare browsers!!


Ever try to even just position simple floats in IE 5.1x/Mac? Do you know how many bugs IE5.5 win had with floats? This is the reason hacks were created in the first place.


Eric Meyer was the first to show everyone how it was done. Clapton is a simple guitarist by todays standards, but in 1967 he blew everyone away.


Stop blaming the CSS and place blame where it belongs, the browser creators. clear:both exists. clear:left exists. clear:right exists. Get the damn modern browsers to be spec compliant, get MS to stop lying about becoming valid only to release yet another monster IE piece of crap that breaks all previous solutions.


Rage at the machine, not the cogs.


By the way, The "modern" clearfix (not the PIE initial method) if used right will do exactly what you want in all browsers - BUT, you may have to add a clear:both element to the non-floated tag following the floated box.



Link to comment
Share on other sites

Actually, I was only a 5th grader back then.


I still don't think developers should worship Eric Meyer. He isn't a css god, or anything. He's just a guy who experiemented a lot with the holy grail of 2003 - floats - and found a neat "hack" to emulate the correct rendering. Hell, if I was 17 back in the day, I probably would have come up with my own potion for clearing divs. Even now, I have several state-of-the-art css techniques.


My point isn't too bash Eric Meyer. He's a highly qualified css developer - I'll give him that - but in my opinion, he doesn't live up to his potential. How many geniuses does it take to figure out that a new css property should be added that would clear all childs within a div.


clear-child: both;


Sure, it would take years for browser developers to emulate this mode and expand their newly upgraded browsers to the public, but at least I could go to sleep soundly knowing that I won't have to spend eternity calculating pixel by pixel to use "overflow: auto/hidden;" or add in clearfix classes which don't work half the time.

Link to comment
Share on other sites

This thread is more than a year old. Are you sure you have something important to add to it?

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.