W3C home > Mailing lists > Public > public-html@w3.org > September 2009

Re: dt/dd in figure/details has killer rendering issues in ie6 and ie7

From: Shelley Powers <shelleyp@burningbird.net>
Date: Fri, 18 Sep 2009 15:39:47 -0500
Message-ID: <4AB3F013.9050507@burningbird.net>
To: "Tab Atkins Jr." <jackalmage@gmail.com>
CC: public-html@w3.org
Tab Atkins Jr. wrote:
> I'm promoting this to a top-level thread, to make sure it gets read by
> people even if they've ignored the bikeshed threads elsewhere on
> similar subjects.  Leif has discovered a *major* rendering bug
> resulting from using dt/dd in figure/details that makes them virtually
> unusable in IE6, IE7, and IE8-as-IE7.
> Here is a minimal test-case demonstrating the error (cribbed from Leif's email):
> <!doctype html>
> <script> document.createElement("figure"); </script>
> <style>
> body{ background: silver; color: #800; margin: 0; text-align: center; }
> figure { display: block; background: green !important; color: white
> !important; text-align: center; border: black dotted 4px; }
> dt, dd { border: #800 solid 4px; color: #88f; }
> </style>
> <p>Gray background represents the body elment</p>
> <figure>
>        <dt>dd/dt element inside figure</dt>
>        <p>content inside figure</p>
> </figure>
> <p>content outside figure</p>
> <p>more content outside figure</p>
> Load that code in any legacy IE, or in IE8 with the IE7 rendering
> engine or quirks mode.  You'll see that while the text color and
> border of the <dt> are being transmitted to *all following content,
> both within and without the <figure>*.  As well, the border on <dt>
> envelops all further content, crossing the <figure>'s border.
> Essentially, as soon as IE encounters a <dt> (or <dd>, the same thing
> happens) outside of <dl>, it switches to a strange mode in its CSS
> parser and subsequently treats all following content on the page as a
> child of the <dt> for the purposes of most/all CSS properties.
> Curiously, the DOM of the page is just fine (as exposed by IE8's
> Developer Tools).  So it's just something in the styling subsystem
> that is crafting a malformed view of the document.
> However, this error is a completely killer of the
> dt/dd-within-figure/details proposal.  The legacy problems are nearly
> equal to those of <legend>.  I, for one, *certainly* expect to use set
> borders and fonts on my <details> toggler, but if that will screw up
> the entirety of the rest of my page in IE7 (or in IE8 if I get tagged
> as needing compat mode for whatever reason), I simply won't use it
> until IE7 is irrelevant.  I don't expect that day to come for years
> yet.
> It appears, then, that if we want <figure> and <details> to be usable
> on any reasonable timeframe, the only solution is a new element, or an
> attribute as I suggested elsewhere.  Pretty much all existing elements
> have been exhausted at this point, I believe.
> ~TJ
Oh, well thank goodness there's now a _real_ reason why dt/dd can't be used.

Received on Friday, 18 September 2009 20:40:32 UTC

This archive was generated by hypermail 2.3.1 : Thursday, 29 October 2015 10:15:51 UTC