HELP: Space between Sliced Images

**Merry1084** · 12-15-2011 02:59 PM

I've created an HTML site using sliced images that I exported from Photoshop. Sometimes when I view it in a browser there are very thin white lines between the images. It's seven images in a horizontal line which make up the navigation bar. I think it has to do with them being in a table format. However, I don't know how to fix the problem. Can you help?? (see code below)
------------------

<td colspan="17">
<img src="../images/Optimized-Header.gif" width="1002" height="188" alt="logo header"></td>
<td>
<img src="../images/spacer.gif" width="1" height="194" alt=""></td>
</tr>
<tr>
<td rowspan="2">
<img src="../images/white-space-top-left.gif" width="44" height="45" alt=""></td>
<td colspan="16">
<img src="../images/Creekside-Layout-Final_03.gif" width="956" height="1" alt=""></td>
<td>
<img src="../images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td colspan="3"><a href="../creekside_homepage.html"><img src="../images/about-btn1.gif" width="157" height="44" alt="about"></a></td>
<td colspan="3"><a href="../steam_and_sauna_page.html"><img src="../images/steam-and-sauna-btn2.gif" width="233" height="44" alt="steam and sauna"></a></td>
<td colspan="3"><a href="../creekside_hot_tubs_page.html"><img src="../images/hot-tubs-btn3.gif" width="162" height="44" alt="hot tubs"></a></td>
<td colspan="3"><a href="../creekside_rentals_page2.html"><img src="../images/rentnals-btn4.gif" width="151" height="44" alt="rentals"></a></td>
<td colspan="3"><a href="../creekside_contact_page.html"><img src="../images/contact-us-btn.gif" width="211" height="44" alt="contact us"></a></td>
<td>
<img src="../images/white-space-top-right.gif" width="42" height="44" alt=""></td>
<td>
<img src="../images/spacer.gif" width="1" height="44" alt=""></td>
</tr>
<tr>

**html-tutorials** · 12-16-2011 03:02 AM

This has to do with the width of table cell border, or padding.

In your TABLE tag, add following:

Code:

<table cellspacing = "0">

In addition, try adding this CSS code into your style.css, externally:

Code:

table
{
    border:0; border-collapse: collapse;
}
table td
{
    padding:0;
}

or, internally, right before table tag:

Code:

<style>
table
{
    border:0; border-collapse: collapse;
}
table td
{
    padding:0;
}
</style>

<table ...

**Merry1084** · 12-16-2011 06:38 PM

Hi, Thank you so much for responding, as this problem has be royally stumped.

I've done what you told me to, however, none of these options are making a difference. Can you think of any other solutions? Here's the link to the site (see the navigation bar): [URL="http://creeksidehottubs.com.sitepreview.mysuperpageshosting.com/creekside_final_layout/creekside_homepage.html

You are right, in that the cell spacing and padding seems to def. be the issue but even when I bring it down to "0", there remains a very slight white border.