html vs netscape

netscape doesn't show empty table cell

[alwaysmandar]

i want to draw x,y axis using table tag.
i m giving u the code for it.
The following code does not work in netscape but works in html?
can anybody tell me the solution for this?

<table border=0 width='390'>
<tr bgcolor=black>
<td width=''></td>
</tr>
</table>

[tedster]

Welcome to Webmaster World, alwaysmander.

You've run into one of Netscape's oddities. If a table cell contains nothing at all, Netscape won't place a background there.

First Try
One way people get around this is putting a non-breaking space within the <td>. But this won't work for your purpose. It makes the whole table as high as a line of type, and you only want line that is 1 pixel high.

Next Step
Instead of using a non-breaking space, use a spacer gif. You know, a 1x1 gif which is transparent. As a second help, use the browser to redraw the gif 390 px wide and drop the table width tag.

Final Step
Set the table's cellpadding and cellspacing to 0 instead of letting them default to 1. This way the padding and spacing won't add any extra height to the table.

The final HTML code, which works cross-browser very nicely:

<table border="0" cellpadding="0" cellspacing="0">
<tr bgcolor="black">
<td><img src="spacer.gif" width="390" height=1 border=0 alt=""></td>
</tr>
</table>

This all seems like a lot of trouble to go to if all you want is a black line that is 390px wide. If that's all you need, you could also create a 1x1 gif that is black. Then you can simply write:

<img src="black.gif" width=390 height=1 border=0 alt="">

This way you get the same effect for a lot less code.

(edited by: tedster at 5:44 pm (utc) on Jan. 20, 2002)

[bird]

The simplest solution might be this:

<table width="55" cellpadding="0" cellspacing="0">
<tr bgcolor ="black">
<td ><img width=1 height=1></td>
</tr>
</table>

I think that produces the result you want.
The trick with the empty <img> tag is one of my best kept secrets... ;) Make sure you use exactly a height of 1 for the virtual image, or you'll get (parts of) an ugly icon displayed instead.

[Marshall]

In my experience, aside from inserting a small image in a cell, the only way Netscape sees an empty cell is to put
<td>& n b s p ;</td>. Of course there shouldn't be spaces between the characters, but if I didn't put them here, the forum program will read it as HTML and create a blank space instead of displaying the characters.

[tedster]

You're right, Marshall. I tried to say that in my post, but I didn't s p a c e out my letters, so my non-breaking space was invisible. I've now edited that flub.

The non-breaking space will give the table cell a height of 1em, which in this case undermines the desired effect of an axis line.

[Marshall]

Tedster,

What I do in this case is make
td.line {
font-height: 1px;
}

Works every time.

[tedster]

Clever! And now that you've said it, obvious as well.

[Marshall]

tedster,

Did you catch the simple script I put up for fluid layouts and image resize?

[webmasterworld.com...]