How to make a table show up only on IE?

[Passenger]

Hi guys. New to these forums, need some help.

I'm planning to insert some content in a table, some of which shows up only on IE. I am hoping there is some code I can use to make the whole table show up only on IE, because the rest of the content in this table doesn't make sense without the IE-only bits.

Would appreciate it if anyone could advise on such a code.

[Twey]

Use an "important" rule.
It works like this:


<style type="text/css">
@media all {
.ieonly {
visibility: hidden !important;
visibility: visible;
}
}
</style>


IE doesn't understand the !important rule, so the first rule to hide the table is overridden by the second, which shows the table. In other browsers that understand !important, the !important will prevent the first rule from being overridden, so the table remains hidden. Ugly hack, but it works.

Another way of doing this does the opposite: using an IE-only feature, "conditional comments." This is a special syntax developed by Microsoft specifically for hiding/showing content to/from IE.


<!--[if IE]>
<table>
This is technically a comment,
so most browsers will ignore it,
but because of the "if," IE will
render it anyway.
</table>
<![endif]-->

[mwinter]

I'd go with conditional comments. Hiding with style sheets will only work if that style sheet rule is applied, and this isn't a future-proof method: when Microsoft eventually fixes their CSS support (which they will to some extent in IE7), the content will be hidden from IE as well.

Mike

[Twey]

Of course, the best thing to do is make the whole table work on other browsers as well.

[Passenger]

Thank you Twey and mwinter. Went with conditional comments and it works beautifully :)