Last modified: 2013-03-09 10:19:04 UTC
Say, what is this <table> doing here at the table of contents? <table id="toc" class="toc" summary="Contents"> <tr> <td> ... </td> </tr> </table> Is this one cell table some remnant of back in the early days of the web when people used tables for page layout? Isn't there a better way to accomplish whatever it is your are trying to do?
A table is used to let the box automatically size correctly, which a <div> doesn't do. An appropriate CSS incantation that works reliably across browsers may or may not exist, in which case we'd be happy to switch it.
For all browsers besides IE < 8, the "display:table" could be used. <div class="toc" id="toc"> the toc </div> div#toc { display:table; } For IE, the following might work within conditional comments: div#toc { float: left; /* or right in rtl */ } div#toc + * { clear:left; /* right in rtl */ } Worked in Firefox, but I can't test it in IE, as this isn't installed on my PC, however, I wouldn't be surprised if there was something IE doesn't support.
display:inline-block is the easiest. Supported in IE6 as well if we make the div hasLayout by setting zoom:1 afterwords.
I'm not sure why would want to switch from: * a semantically correct use of tables that works without hacks in all browser we support to: * a semantically meaningless div with a css-rule to make it behave like a table which requires a IE6-hack as well to make it work in IE6. TOC stands for Table of Contents...
Hm.. on second thought, it's not really being used as a table from what I can see. It's an unordered list actually with a <div> for the title. So, switching from one 'hack' to another, may not be that bad if it saved a bit of markup :-)
Done in r93264
Reverted in r93436 -- please see code review comments on r93264.
*** This bug has been marked as a duplicate of bug 658 ***