Post Archive
› May 16, 2004
Clearing floats without structural markup
How many times have you messed around with special clearing divs and worrying about additional markup? Tony Alsett came up with an interesting solution which he presented it at a recent Brisbane Web Standards Group meeting. His method is detailed at Position is Everything and his own site. You can also check out the forum discussion and his presentation notes (powerpoint) from the meeting.
Comments
1. May 16, 2004 07:59 PM
2. May 17, 2004 10:03 AM
Matthew Posted…
The hack sadly doesn't work for all situations - it only covers one aspect of the float bug. For example, in IE this page will loose part of its text when the user hovers over the links unless I have a <div style='clear:both'> at the bottom, holly hack or no holly hack.
3. May 17, 2004 10:10 AM
Matthew Posted…
I take it all back - Yay for the holly hack
I just had to float all the child elements in the main div and it worked.
4. May 17, 2004 04:26 PM
Andrew Posted…
Swank hack, works great. Who has a jihad against generated content?
5. May 17, 2004 05:57 PM
scott partee Posted…
While this is, indeed, a great hack, sometimes it just depresses me that this is where we are in the world of web page creation. It shouldn't be like this. Sure, people can still rock FrontPage or whatever, so the web still has a low barrier to entry, but one shouldn't have to do lines and lines of "code" to simply get two elements to display properly in relation to each other. *sigh*
Moose Posted…
I created a working example of that a couple of months ago on the Opera forum, by way of proving to the unbelievers that Opera 7.5 did (and does) have a bug when a floated element is taller than the viewport, and directly interacts with the bottom edge of the viewport. One of two ways that helped me to go around the bug that made Opera lose the bottom margin on said float was to create a cleared generated content of block display and fixed dimensions for the float. The other way was to append generated content for the root element, but then, it triggered on another bug in Opera. Other pure-css methods failed in both Firefox and Opera, so I was left in the cold.
But who cares that my work is lost. All that matters is that people will start to think seriously of generated content instead of dismissing it because EITHER some not to be named browsers that are NOT meade by Microsoft do not support it OR because they tend to have joined some religious jihad against generated content for never disclosed reasons. I anxiously await the day when said browser implement the spec in full. Long-derided methods will be suddenly exclaimed upon, and the mutual self-satisfaction grassroots movement shall start.
Oh boy, how relatively Hegelian this world is
M.