empty table cell problem

Not showing up as empty on IE

[karmov]

I'm using the XHTML 1.0 Transitional DTD and trying to create a table that looks roughly like this:

<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="0"></td>
<td rowspan="2">x</td>
<td rowspan="2">y</td>
</tr>
<tr>
<td>z</td>
</tr>
</table>

however the first td still shows as a one pixel sliver in IE. Looks right in Mozilla (all three columns appear to be the same height), but I cna't seem to figure out how to get rid of that one pixel sliver in IE. Since most of my visitors use IE, it's not something I can ignore. Anyone know how to fix this?

[pageoneresults]

<table border="0" cellpadding="0" cellspacing="0"> 
<tr> 
<td>&nbsp;</td> 
<td rowspan="2">x</td> 
<td rowspan="2">y</td> 
</tr> 
<tr> 
<td>z</td> 
</tr> 
</table>

Drop an

 

in there and see if that solves the problem. Also, remove the height attribute.

nbsp = non breaking space

[isitreal]

Is there a reason you don't just make this a three cell, one row table, which appears to be what you are looking for?

[karmov]

I had tried the &nbsp; already and it didn't work. It makes the cell the height of a character.

I'm trying to do this since it would allow me to have my left hand menu items as the last thing on the page. Putting my content up higher. Read the suggestion somewhere but I cna't remember where.

Still stuck... Any other suggestions?

[mvuijlst]

You're better off using CSS to do that. One way to do it is to put the content first in a div with a left margin the width of your navigation, then after the content have a div with the navigation, and position it absolutely at the top left.

[DrDoc]

There is no such thing as a table cell with zero height, zero width, and no content. And, if that is what you want, why not follow isitreal's suggestion to make it a 1×3 table, since that is exactly what you're trying to do anyway...

Or, is one pixel really making THAT much of a difference?

[pageoneresults]

I'm trying to do this since it would allow me to have my left hand menu items as the last thing on the page. Putting my content up higher. Read the suggestion somewhere but I cna't remember where.

Here is a topic from 2004 January that discusses the issue. There is a link in that topic to an accessibility article explaining how to do this. It is referred to as the table trick, go figure. ;)

How important is source ordered content in your layout? [webmasterworld.com]

[edited by: pageoneresults at 7:15 pm (utc) on April 15, 2004]

[karmov]

Thanks a ton Pageone. My problem was in trying to have nothing in the cell. Now that I've seen their approach I don't think I even need to use the trick as I've got something that could go into that corner. Again, thanks.