Extra vertical space between TABLEs when viewed in Safari

I write HTML code for a living and I am stumped on this one.

I create a page that has two TABLEs consecutively, one on top and one below it. Both tables are filled with a background color. in every browser on every platform I can test (Windows IE, FF, NS; OSX IE, FF NS), there is never any visible space between the 2 tables. But in Safari there is always a few pixels of vertical space between the 2 tables. This causes problems when I want the tables to appear to be continuous, and touching....sample code:

<TABLE cellpadding=0 cellspacing=0 border=0 bgcolor="blue">
<tr><td>content here...</td></tr>
</TABLE>

<TABLE cellpadding=0 cellspacing=0 border=0 bgcolor="blue">
<tr><td>content here...</td></tr>
</TABLE>

Does anyone know how to work around this issue and not have the extra space render between the 2 tables?

PowerBook G4 12" Mac OS X (10.4.7)

Posted on Aug 15, 2006 10:08 PM

Reply
5 replies

Aug 16, 2006 6:14 AM in response to JoeCuv

I too was able to get the tables to be joined together with no gaps.

I have seen this before, especially when the cells contains some graphics. I cannot fully explain what the cause is, but one way I have been able to solve it in the past is through using one of the styles: margin, margin-right, margin-left, margin-top, or margin-bottom. Use a negative value such as -1 or -2 and see if that helps.

Example would be:<pre>
<TABLE cellpadding=0 cellspacing=0 border=0 bgcolor="blue">
<tr><td>content here...</td></tr>
</TABLE>

<TABLE cellpadding=0 cellspacing=0 border=0 bgcolor="blue" style="margin-top:-2;">
<tr><td>content here...</td></tr>
</TABLE>
</pre>

Aug 16, 2006 6:19 AM in response to scott_apple

Figures... as soon as I clicked on the Post Message button I thought of a way to illustrate this better... Here is a new example. Notice the <BR /> between the tables. The larger negative adjustment closes the gap as if the <BR /> is not there.

New Example:<pre>
<TABLE cellpadding=0 cellspacing=0 border=0 bgcolor="blue">
<tr><td>content here...</td></tr>
</TABLE>
<br />
<TABLE cellpadding=0 cellspacing=0 border=0 bgcolor="blue" style="margin-top:-18;">
<tr><td>content here...</td></tr>
</TABLE>
</pre>

Aug 16, 2006 11:43 AM in response to scott_apple

Well don't I feel stupid. I have a habit of writing tables like this:

<TABLE cols="2" cellpaddding="0"...

The 'cols=' for columns is an old attribute I picked up years ago. It turns out that it is no longer used, or maybe never was. That was forcing the extra space. Thanks for all the help and sorry for the confusion. You helped me figure it out, so that was good.

PowerBook G4 12" Mac OS X (10.4.7)

Aug 17, 2006 1:57 PM in response to JoeCuv

The attribute cols on the TABLE tag is valid (in some historical standard/browser), but not part of the W3.org's standards for HTML v4.1.

I did find that there was a proposal in a document dated May 1996 through w3c that did suggest its usage. It was in RFC 1942: http://www.ietf.org/rfc/rfc1942.txt

Apparently the proposal was discussing the pros and cons of a two pass versus a one pass algorithm for table rendering, and the use of rows would have been a "hint" to allow the one pass algorithm to be used.

Unfortunately, I have a feeling that if a programmer puts a value of 4 in there but then adds another column it caused too much trouble where if it would then have to fall back on the two pass algorithm, then it would have wasted too much time.

I can almost remember the days when you did have to worry about performance. It appears like performance issue now a days has the general trend of "lets just make it fast enough and then wait for the next generation of processors and hardware to be released". Could one almost say that the computer sector of the economy is partially fueled by laziness to write efficient code? 😉

JoeCuv, thanks for pulling out that little oddity. Interesting where computers and their languages have traveled in the last 10 years!

This thread has been closed by the system or the community team. You may vote for any posts you find helpful, or search the Community for additional answers.

Extra vertical space between TABLEs when viewed in Safari

Welcome to Apple Support Community
A forum where Apple customers help each other with their products. Get started with your Apple Account.