On 6/28/07, Alan Pennell-Smith <[EMAIL PROTECTED]> wrote:
>
> So I decided to use a defintion list. I'm getting desired results in
> Firefox, Safari and Opera but good ol' IE (6 & 7) is being a pain as
> usual.
> The problem seems to stem from IE not clearing the DD's (clear:left is
> on the DT);
>
> http://www.berkeleyhomes.co.uk/dl_floats.html
IE/Win has many problems when there is "float" and "clear" on the same
element [1], [2]; later floats may go higher than expected, like in
your case.
AFAIK there is no real workaround to this, usually is also necessary
to make changes to the markup, adding elements or reordering things.
In your case it seems that the following solves the problem, but it's
an horrible solution :-)
Add an extra empty dd at the end of any group (before the following
dt). You can use conditional comments to avoid affecting other
browsers, like so:
<!--[if IE]><dd class="fixiedd"></div><![endif]-->
and make those dd not floated:
.fixiedd { float: none !important; height: 0; }
I've only tested in IE6.
There are surely other solutions (for example not having all dt and dd
floats, or playing with a width on the dl if all your elements have a
fixed width, ...)
hth,
Bruno
[1] http://www.brunildo.org/test/IEWfc.html
[2] http://www.brunildo.org/test/IEWfc2.html
--
Bruno Fassino http://www.brunildo.org/test
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
