I havent done HTML in ages, so when I was redesigning my site, I used pohotoshop (slices and whatnot) to make my page and generated the html. When I open the html file on firefox its perfect, seemless,

but when copy it to my website horrible white gaps appear between the slices and I dont know why because the code hasnt changed :(

Please help

Heres my code,

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>quailpower header</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body bgcolor="#FFFFFF">
<!-- Save for Web Slices (quailpower header.psd) -->
<table id="Table_01" width="1280" height="628" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="3">
<img id="quailpower_header_01" src="quailpower-header_01.gif" width="1280" height="54" alt="" /></td>
</tr>
<tr>
<td rowspan="9">
<img id="quailpower_header_02" src="quailpower-header_02.gif" width="106" height="574" alt="" /></td>
<td>
<a href="www.quailpower.co.uk">
<img id="quailpowerx20header_03" src="quailpower-header_03.gif" width="30" height="48" border="0" alt="" /></a></td>
<td rowspan="9">
<img id="quailpower_header_04" src="quailpower-header_04.gif" width="1144" height="574" alt="" /></td>
</tr>
<tr>
<td>
<img id="quailpower_header_05" src="quailpower-header_05.gif" width="30" height="109" alt="" /></td>
</tr>
<tr>
<td>
<a href="www.quailpower.co.uk/art">
<img id="quailpowerx20header_06" src="quailpower-header_06.gif" width="30" height="53" border="0" alt="" /></a></td>
</tr>
<tr>
<td>
<a href="www.quailpower.co.uk/kitchen">
<img id="quailpowerx20header_07" src="quailpower-header_07.gif" width="30" height="60" border="0" alt="" /></a></td>
</tr>
<tr>
<td>
<a href="www.quailpower.co.uk/photography">
<img id="quailpowerx20header_08" src="quailpower-header_08.gif" width="30" height="60" border="0" alt="" /></a></td>
</tr>
<tr>
<td>
<a href="www.quailpower.co.uk/progress">
<img id="quailpowerx20header_09" src="quailpower-header_09.gif" width="30" height="63" border="0" alt="" /></a></td>
</tr>
<tr>
<td>
<a href="www.quailpower.co.uk/about">
<img id="quailpowerx20header_10" src="quailpower-header_10.gif" width="30" height="64" border="0" alt="" /></a></td>
</tr>
<tr>
<td>
<a href="www.quailpower.co.uk/shop">
<img id="quailpowerx20header_11" src="quailpower-header_11.jpg" width="30" height="63" border="0" alt="" /></a></td>
</tr>
<tr>
<td>
<img id="quailpower_header_12" src="quailpower-header_12.gif" width="30" height="54" alt="" /></td>
</tr>
</table>
<!-- End Save for Web Slices -->
</body>
</html>
<div id="content-wrapper">
<div id="content">%%CONTENT%%</div>
</div>
<div id="footer">
<div id="footer-content">%%WEEBLYFOOTER%%<div>
</div>
</div>
</body>
</html>

nevermind i just re-did it with div and its fine haha

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.