Hey,

there are sp

aces in my ta

ble!

There are a few reasons why there may be spaces in your tables. And keep in mind that when using tables in this manner, different browsers will sometimes render your table in different ways. Add to that, the same browser may render your table differently depending on the DocType you choose for your page. So, the moral here is... don't get too crazy using tables to lay out images and check your work in a couple different browsers.

1. Table 1 - First, here is a table with the borders on so you can see the table layout and the individual images.
   
2. Table 2 - Second, this is a table with no spaces.
   
3. Table 3 - One reason is not setting cellpadding and cellspacing to 0. The usual defaults are usually 1 and 2 respectively.
   
4. Table 4 - One of the more elusive reasons for odd little gaps are carriage returns within the cells. Some browsers will show gaps between all cells, some browers will show gaps only between rows, and some browsers won't show any gaps at all. What you can be sure of is that taking the precaution below will remove this possible cause of gaps from ALL browsers.

Change this:
   <td>
   <img>
   </td>

To this:
   <td><img></td>

Or, change this:
   <td>
   <img>
   <img>
   <img>
   </td>

To this:
   <td><img><img><img></td>

If you want to add carriage returns, do it within the tags themselves rather than between them:
   <td
   property1="0"
   property2="0"
   property3="0"><img
     attribute1="0"
     attribute2="0"
     attribute3="0"></td>

5. Table 5 - If you use the images as links, you'll want to make sure that the attribute border="0" is in the image tag or you might get not only spaces, but blue boxes around the sections (blue or whatever your link color is). Actually, it is good practice to include border="0" in there anyway, because some browsers may default at 1. Also, this "problem" shows up with some browsers and not with others.
   
6. Table 6 - If you have included the HTML 4 Strict DocType Declaration at the top of your document, then your table won't show spaces in Internet Explorer, but may show spaces in other browsers. As for the reasons, a usenet poster named trx explained it well...

When you use a strict doctype, all Gecko browsers (Firefox, Mozilla, etc) correctly put images in table cells on the baseline of the linebox (that's the same as the text baseline, which allows space for text descenders) and thus you get the gaps that you see. As a concession to tables-based designers, Gecko browsers do not do this when a transitional doctype is used.

If you want to keep your strict doctype, you can eliminate the gaps by setting your images to display block. To do this, add the following rule to your stylesheet

 
img {
 display: block;
}

But it is really more appropriate and less problematic to go with a transitional doctype when using a tables-based design.

Keep in mind that these things can be happening one at a time, or in combination. Also, even with these three direct causes eliminated, you may find that something else is causing the problem indirectly.