A problem that only appears in IE7. Basically I've got lots of tables in this thing and it doesn't get too complicated but in IE7 there's extra gaps on the top and bottom of each TD. The browsers seems to force extra space in the margins. I've actually solved this problem on another one of my sites but for the life of me I can't find why it's not working on this one. I can't find any real differences in code that would cause this. I've set all the margins to 0. I've tried aligning the thing. I've made sure I didn't put the spaces in myself. The only thing I could figure is maybe I made the tables too complex, I've got a lot of 'em in eachother but don't know why that would do anything. How can I help these spaces go away? lul
The server is use isn't currently available. Here's the code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <style type="text/css"> html, body { font-family: "Arial", Times, serif; margin: 0px auto; margin-bottom: 0px auto; } a:link { color: #9e5f38; text-decoration: none; } a:visited { text-decoration: none; color: #9e5f38; } a:hover { text-decoration: underline; color: #9e5f38; } a:active { text-decoration: none; color: #9e5f38; } </style> <title>...</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body background="../images/background2.gif" topmargin="0" bottommargin="0"> <table width="100%" height="574" cellpadding="0" cellspacing="0" background="../images/background.gif"> <tr><td> <center> <table width="830" height="574" cellpadding="0" cellspacing="0"> <tr> <td rowspan="6" width="16" height="574"><img src="../images/leftshade.png"> </td> </tr> <td width="798" height="91"> <table width="798" height="91" cellpadding="0" cellspacing="0"> <tr> <td rowspan="2" width="440" height="91" valign="top"><a href="index.htm"><img src="../images/logo.gif" border="no"></a> </td> <td width="211" height="23" valign="top"> <a href="contact.htm" onMouseOver="document.estimate.src='../images/estimate.gif'" onMouseOut="document.estimate.src='../images/estimate1.gif'"> <img src="../images/estimate1.gif" name="estimate" alt="link: Java Script / Applets Page" border="0"></a> </td> <td width="147" height="23" valign="top"> <a href="contact.htm" onMouseOver="document.demolition.src='../images/demolition.gif'" onMouseOut="document.demolition.src='../images/demolition1.gif'"> <img src="../images/demolition1.gif" name="demolition" alt="link: Java Script / Applets Page" border="0"></a> </td> </tr> <tr> <td colspan="2" width="358" height="68" valign="top"><img src="../images/phone.gif"></td></tr> </table> </td> <td width="16" height="556" rowspan="6"><img src="../images/rightshade.png"> </td> </tr> <tr> <td width="798" height="381"><table width="798" height="381" cellpadding="0" cellspacing="0"> <td width="200" height="30" colspan="2"><img src="../images/logocut.gif"></td> <td width="598" height="411" rowspan="2" background="../images/mainbg.gif"> <table width="598" height="411" cellpadding="0" cellspacing="0"> <tr> <td height="30"> </td> </tr> <tr> <td height="349"> ... </td> </tr> <tr> <td height="32"> </td> </tr> </table> </td> </tr> <tr> <td width="147" height="381"> <table width="147" height="381" cellpadding="0" cellspacing="0"> <tr> <td width="14" height="147" valign="top"> <img src="../images/space1.gif"> <a href="../index.htm" onMouseOver="document.home.src='../images/mainbuttons/home3.gif'" onMouseOut="document.home.src='../images/mainbuttons/home2.gif'"> <img src="../images/mainbuttons/home2.gif" name="home" alt="link: Java Script / Applets Page" border="0"></a> <img src="../images/space2.gif"> <img src="../images/mainbuttons/about1.gif"> <img src="../images/space3.gif"> <a href="services.htm" onMouseOver="document.services.src='../images/mainbuttons/services3.gif'" onMouseOut="document.services.src='../images/mainbuttons/services2.gif'"> <img src="../images/mainbuttons/services2.gif" name="services" alt="link: Java Script / Applets Page" border="0"></a> <img src="../images/space4.gif"> <a href="gallery.htm" onMouseOver="document.gallery.src='../images/mainbuttons/gallery3.gif'" onMouseOut="document.gallery.src='../images/mainbuttons/gallery2.gif'"> <img src="../images/mainbuttons/gallery2.gif" name="gallery" alt="link: Java Script / Applets Page" border="0"></a> <img src="../images/space5.gif"> <a href="products.htm" onMouseOver="document.products.src='../images/mainbuttons/products3.gif'" onMouseOut="document.products.src='../images/mainbuttons/products2.gif'"> <img src="../images/mainbuttons/products2.gif" name="products" alt="link: Java Script / Applets Page" border="0"></a> <img src="../images/space6.gif"> <a href="contact.htm" onMouseOver="document.contact.src='../images/mainbuttons/contact3.gif'" onMouseOut="document.contact.src='../images/mainbuttons/contact2.gif'"> <img src="../images/mainbuttons/contact2.gif" name="contact" alt="link: Java Script / Applets Page" border="0"></a> <img src="../images/space7.gif"> </td> </tr> </table> </td> <td width="53" height="381" valign="top"><img src="../images/middlebg.gif"></td> </tr> </table></td> </tr> <tr> <td width="798" height="28"> <a href="gallery.htm" onMouseOver="document.driveways.src='../images/driveways1.gif'" onMouseOut="document.driveways.src='../images/driveways.gif'"> <img src="../images/driveways.gif" name="driveways" alt="link: Java Script / Applets Page" border="0"></a><a href="gallery.htm" onMouseOver="document.walkways.src='../images/walkways1.gif'" onMouseOut="document.walkways.src='../images/walkways.gif'"><img src="../images/walkways.gif" name="walkways" alt="link: Java Script / Applets Page" border="0"></a><a href="gallery.htm" onMouseOver="document.patios.src='../images/patios1.gif'" onMouseOut="document.patios.src='../images/patios.gif'"><img src="../images/patios.gif" name="patios" alt="link: Java Script / Applets Page" border="0"></a><a href="gallery.htm" onMouseOver="document.pool.src='../images/pool1.gif'" onMouseOut="document.pool.src='../images/pool.gif'"><img src="../images/pool.gif" name="pool" alt="link: Java Script / Applets Page" border="0"></a><a href="gallery.htm" onMouseOver="document.retaining.src='../images/retaining1.gif'" onMouseOut="document.retaining.src='../images/retaining.gif'"><img src="../images/retaining.gif" name="retaining" alt="link: Java Script / Applets Page" border="0"></a><a href="gallery.htm" onMouseOver="document.more.src='../images/more1.gif'" onMouseOut="document.more.src='../images/more.gif'"><img src="../images/more.gif" name="more" alt="link: Java Script / Applets Page" border="0"></a> <a href="gallery.htm" onMouseOver="document.walkways.src='../images/walkways1.gif'" onMouseOut="document.walkways.src='../images/walkways.gif'"> </a> <a href="gallery.htm" onMouseOver="document.patios.src='../images/patios1.gif'" onMouseOut="document.patios.src='../images/patios.gif'"> </a> <a href="gallery.htm" onMouseOver="document.pool.src='../images/pool1.gif'" onMouseOut="document.pool.src='../images/pool.gif'"> </a> <a href="gallery.htm" onMouseOver="document.retaining.src='../images/retaining1.gif'" onMouseOut="document.retaining.src='../images/retaining.gif'"> </a> <a href="gallery.htm" onMouseOver="document.more.src='../images/more1.gif'" onMouseOut="document.more.src='../images/more.gif'"> </a> </td> </tr> <tr> <td width="798" height="26"> <a href="products.htm" onMouseOver="document.beautiful.src='../images/beautiful1.gif'" onMouseOut="document.beautiful.src='../images/beautiful.gif'"> <img src="../images/beautiful.gif" name="beautiful" alt="link: Java Script / Applets Page" border="0"></a><a href="products.htm" onMouseOver="document.durable.src='../images/durable1.gif'" onMouseOut="document.durable.src='../images/durable.gif'"><img src="../images/durable.gif" name="durable" alt="link: Java Script / Applets Page" border="0"></a><a href="products.htm" onMouseOver="document.lasting.src='../images/lasting1.gif'" onMouseOut="document.lasting.src='../images/lasting.gif'"><img src="../images/lasting.gif" name="lasting" alt="link: Java Script / Applets Page" border="0"></a><a href="products.htm" onMouseOver="document.crack.src='../images/crack1.gif'" onMouseOut="document.crack.src='../images/crack.gif'"><img src="../images/crack.gif" name="crack" alt="link: Java Script / Applets Page" border="0"></a><a href="../sites/products.htm" onMouseOver="document.warranty.src='../images/warranty1.gif'" onMouseOut="document.warranty.src='../images/warranty.gif'"><img src="../images/warranty.gif" name="warranty" alt="link: Java Script / Applets Page" border="0"></a> <a href="products.htm" onMouseOver="document.durable.src='../images/durable.gif'" onMouseOut="document.durable.src='../images/durable1.gif'"> </a> <a href="products.htm" onMouseOver="document.lasting.src='../images/lasting.gif'" onMouseOut="document.lasting.src='../images/lasting1.gif'"> </a> <a href="products.htm" onMouseOver="document.crack.src='../images/crack.gif'" onMouseOut="document.crack.src='../images/crack1.gif'"> </a> <a href="products.htm" onMouseOver="document.warranty.src='../images/warranty.gif'" onMouseOut="document.warranty.src='../images/warranty1.gif'"> </a> </td> </tr> <tr> <td width="798" height="18"> <img src="../images/bottomshade.png"> </td> </tr> </table></td> </tr> </table> </td></tr> </table> </center> </body> </html> I'll give you a pic soon.
Fixed your statement. Have you tried cellspacing/cellpadding Yet? --Edit-- Nevermind, you updated your post while I was posting. Try this: (in your CSS) tr, td{ margin: 0; padding: 0; }
Yes I've tried that. Anyways I'll give you a picture as soon as Photobucket unlocks me out. I forgot my password and apparently tried to log in too many times...
Ignore the red. It's for content. I left out the top bar and bottom bar which face the same issue. Again this is only in IE and not in Firefox, Netscape, Opera or Safari.
lul I need some serious help here. I've gotten to the point where I'm comparing side by side the code with others that work in IE that I've done but still can't find why this particular creation has the spacing problem. It's driving me crazy and I've gotta turn this thing in on Tuesday! XP I even tried just recreating the thing from scratch but it's doing the same thing.