Sent by Mark Hadley on 19 October 2004 08:08
Hi,
I've been messing around with the "easy clearing" solution that's explained here:
http://www.positioniseverything.net/easyclearing.html
http://www.csscreator.com/attributes/containedfloat.php
The above method describes a way to "enclose" floats using :after and no extra markup which is
great, no more "clearing" elements hoorah!, but the downside is that it uses a DOM fix for IE on the
mac which i didn't like the idea of having to include on every page... anyway, while messing around
with this i stumbled on the fact that applying display: inline-block; width: 100%; to the
"container" div seems to bring IE-mac in line with all other browsers. The display: inline-block;
seems to be inconsistent results across other browsers so i gave it just to IE-mac.
Here's a quick test page:
http://www.nolocation.com/test/float.html
http://www.nolocation.com/css/float.css
If all is well you should see some red!
Now this seems to work consistently for enclosing floats without having to resort to javascript in
all the browsers i've tested but before i go using it all over the place! i thought i'd post here
for a sanity check, so:
1. Is this "solution" sound and can anybody see any problems with using it?
2. display: inline-block; doesn't seem to validate in the w3c css validator although i believe it is
part of the css2.1 and css3 specs, presumably this is just an ommission from the validator?
Cheers,
Mark.
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/