IE will always render a table as a table... or will it?

[aboycalled3]

I'm interested in using the fascinating CSS available at

http://www.moronicbajebus.com/playgr...eformat-table/

which allows one to present tabular data in a way that's more appealing
to the eye (at least to my eye it's more appealing :^)

To my mind this is very much what CSS is all about: allowing content
providers to present properly coded data in a way they and, ideally,
their readers, find inviting and accessible. Unfortunatley, the CSS
doesn't work in IE. I figured the easiest way to fix the situation would
be to call on IE7:

http://dean.edwards.name/IE7/

Unfortunately, the markup/css chokes IE7, though my reading of the CSS
on the site and the IE7 documentation seems to indicate it should not. I
contacted the IE7 forum on SourceForge.net and received the following
response:

--

i've looked at this site before. i'm afraid there is no way to get this
to work in IE without rewriting the HTML. IE will always render a table
as a table...

-dean

--

Has anyone in this group ever been successful in making IE render a
table as anything other than a table? Any hints as to what might allow
such a thing to happen?

Thanks,

Brett

[VK]

> IE will always render a table

Eh? A table which is not a table? Philosophically profound, but a bit
cloudy.

In the sample .css file I see a bunch of styles applied to different parts
of the table. It changes the TABLE appearance, but it's still TABLE.

If you don't want a table to be a table, what do you want it to be today?

[aboycalled3]

VK wrote on 12/6/2004 10:16 AM:

IE will always render a table

Eh? A table which is not a table? Philosophically profound, but a bit
cloudy.

In the sample .css file I see a bunch of styles applied to different parts
of the table. It changes the TABLE appearance, but it's still TABLE.

If you don't want a table to be a table, what do you want it to be today?

I want to use TABLE markup because the data being marked up is best
suited to being organized as a structured table. But complex tables are
difficult for browsers to render in a way that readers can readily
digest. I'd like to alter the default table presentation. Firefox allows
for this; IE does not. My hope was to use Dean Edwards's
javascript-based IE7 to make IE5+ override its default table rendering
but Edwards has said it cannot be done. I believe he knows what he's
doing--IE7 is proof of that--but I hoped a javascript expert in this
group might have an idea or a technique or something that Edwards hadn't
considered. Because it seems a shame to have to encode tabular data as
DIV or UL simply because IE won't cooperate and it also seems a shame to
make IE users view tabular data in a less visually appealing format than
Firefox users are viewing it.

[Michael Winter]

On Mon, 06 Dec 2004 14:20:29 GMT, aboycalled3
<ab*********@myNOrealSPAMbox.com> wrote:

[snip]

Unfortunately, the markup/css chokes IE7, though my reading of the CSS
on the site and the IE7 documentation seems to indicate it should not.
I'm afraid it should. The reason is that unlike modern browsers, IE uses
"display: block" for the various table components. As this is what the
"overridding CSS" uses, IE sees no difference and does nothing, whereas
this is a huge difference for modern browsers and they change their
rendering accordingly.

[snip]
Has anyone in this group ever been successful in making IE render a
table as anything other than a table? Any hints as to what might allow
such a thing to happen?

I believe your only option is to "walk" through the table, pulling apart
the various bits and stuffing them into dynamically created DIVs or other
simple mark-up. This shouldn't be necessary for all browsers. A possible
test would be to create a TABLE element and then check the computed style
(not obj.style). If it's display property is 'table', the stylesheet
should have the desired effect. If not, hack away at the document tree. :)

Good luck,
Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

[Brett Bonfield]

Michael Winter wrote on 12/7/2004 9:03 AM:

On Mon, 06 Dec 2004 14:20:29 GMT, aboycalled3
<ab*********@myNOrealSPAMbox.com> wrote:

Unfortunately, the markup/css chokes IE7, though my reading of the CSS
on the site and the IE7 documentation seems to indicate it should not.

I'm afraid it should. The reason is that unlike modern browsers, IE uses
"display: block" for the various table components. As this is what the
"overridding CSS" uses, IE sees no difference and does nothing, whereas
this is a huge difference for modern browsers and they change their
rendering accordingly.

Thank you for responding and for explaining things to me. Is there
anywhere you'd recommend reading documentation on this "feature"? I'm
having no luck with Google.

Has anyone in this group ever been successful in making IE render a
table as anything other than a table? Any hints as to what might allow
such a thing to happen?

I believe your only option is to "walk" through the table, pulling apart
the various bits and stuffing them into dynamically created DIVs or other
simple mark-up. This shouldn't be necessary for all browsers. A possible
test would be to create a TABLE element and then check the computed style
(not obj.style). If it's display property is 'table', the stylesheet
should have the desired effect. If not, hack away at the document tree. :)

Good luck,
Mike

How does one check the property of the computed style (vs. obj.style)?
The thing is, I don't want to take a TABLE and redefine it as a DIV for
some browsers. If I were to do that, I think I'd rather just use
XML/XSLT. This is more about using the structures already defined by the
HTML spec (and the CSS spec as well). But I hear you... IE's just not
going to play nicely, no matter how much I wish it would.

Again, I really appreciate your response, your explanation, and your
suggestion,

Brett

[Michael Winter]

On Wed, 08 Dec 2004 19:42:07 GMT, Brett Bonfield
<ab*********@myNOrealSPAMbox.com> wrote:

Michael Winter wrote on 12/7/2004 9:03 AM:
[snip]

[...] unlike modern browsers, IE uses "display: block" for the various
table components. [...]

Thank you for responding and for explaining things to me. Is there
anywhere you'd recommend reading documentation on this "feature"? [...]

The display properties of table-related elements? Microsoft's
documentation for the display property[1] includes a list of values
initially assigned to the various HTML elements. However, if you look at
the CSS 2 Specification with regard to tables[2], you'll see Microsoft
aren't even close.

[snip]
How does one check the property of the computed style (vs. obj.style)?
Using the getComputedStyle method. This returns a CSSStyleDeclaration
object which contains the computed style values for a particular element.

var cS = null, dV = document.defaultView, div, tbl;
/* First check that the host provides the methods we'll need. */
if(document.createElement && dV && dV.getComputedStyle) {
/* In order for some browsers to accurately reflect the style
* of the table element, that element must be added to some
* other container. So, we'll create a DIV for this purpose.
*/
div = document.createElement('DIV');
tbl = document.createElement('TABLE');
if(div && tbl && div.appendChild) {
div.appendChild(tbl);
/* Obtain the computed style object for the
* new table and check the display property.
*/
if((cS = dV.getComputedStyle(tbl, null))
&& ('table' == cS.display))
{
/* The table uses the correct value. */
}
}
}

The reason for not using the style object is that it reflects the inline
style - applied either through the style HTML attribute or the style
object itself - only and not values inherited from stylesheets.
The thing is, I don't want to take a TABLE and redefine it as a DIV for
some browsers.

The alternative, for IE at least, is to hide the CSS. IE will display the
table as usual and better browsers will do what you intend.

[snip]

Mike
[1]
<URL:http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/display.asp>

[2] The respective elements are in parentheses
<URL:http://www.w3.org/TR/REC-CSS2/tables.html#q2>

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.