Log in

View Full Version : Problem with tables in IE


sonicfan94
01-29-2008, 03:06 AM
when I view my new website: http://www.determination.zzl.org in internet explorer, the bottom column of the last row is off. I can not for the life of me figure out why its off. If anyone can help I would be eternally grateful!

Here's the code:


<head>
<title> // Determination // </title>
<link type="text/css" rel="stylesheet" href="style.css">
</head>

<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0" marginheight="0" marginwidth="0">

<map id="pic"><area shape="rect" coords="10,35,370,100" href="http://determination.zzl.org" target="main" alt="Home"></map>

<table width="1000" height="100%" cellpadding="0" cellspacing="0" border="0" align="left">

<!----- HEADER --------->
<tr>
<td valign="top" rowspan="5" border="0">
<img src="http://img.photobucket.com/albums/v203/sonicfan94/determination/image.jpg" usemap="#pic" width="401" height="724" border="0">
</td>

<!--- LEFT TOP SIDE -------->
<td valign="top" colspan="2" height="19" border="0">
<img src="http://img.photobucket.com/albums/v203/sonicfan94/determination/topnav.jpg" width="599" height="19" border="0"></td>
</tr>


<tr>
<td valign="top" border="0" background="http://img.photobucket.com/albums/v203/sonicfan94/determination/nav.jpg" width="572" height="34" border="0"><center>
<!-------------- NAV BEGINS HERE -------------------------->
<a href="layouts/layoutpick.htm" target="main" class="nav">
<img src="http://i30.photobucket.com/albums/c343/sonicfan98/buttons/spacer.gif" width="19" border="0">Layouts</a>

<a href="icons/iconpick.htm" target="main" class="nav2">
<img src="http://i30.photobucket.com/albums/c343/sonicfan98/buttons/spacer.gif" width="22" border="0">Icons</a>
<a href="wallpapers/wallpick.htm" target="main" class="nav">
<img src="http://i30.photobucket.com/albums/c343/sonicfan98/buttons/spacer.gif" width="21" border="0">Walls</a>
<a href="tutorials/maintut.htm" target="main" class="nav2">
<img src="http://i30.photobucket.com/albums/c343/sonicfan98/buttons/spacer.gif" width="21" border="0">Tutorials</a>
<a href="site/sitepick.htm" target="main" class="nav">
<img src="http://i30.photobucket.com/albums/c343/sonicfan98/buttons/spacer.gif" width="10" border="0"> Site</a>

</center>
<!-------------------------- END NAV ---------------------->
</td>

<!---- RIGHT------>
<td valign="top" width="28" border="0">
<img src="http://img.photobucket.com/albums/v203/sonicfan94/determination/navright2.jpg" width="28" height="34" border="0"></td>

</tr>
<tr>
<!---- MIDDLE PART ---->
<td valign="top" width="599" colspan="2" border="0">
<img src="http://img.photobucket.com/albums/v203/sonicfan94/determination/middle.jpg" width="599" height="17" border="0"></td>
</tr>

<!--------- CONTENT ---------->
<tr>
<td valign="top" background="http://img.photobucket.com/albums/v203/sonicfan94/determination/content2.jpg"
width="571" border="0">
<!----------------- CONTENT BEGINS HERE------------------>
<div class="strength">Welcome to Determination</div>
<BR>
New site! Lets hope it works ... -________-

<!------------------- END CONTENT ----------------------->
</td>
<!---------- content right --------->

<td valign="top" border="0">
<img src="http://img.photobucket.com/albums/v203/sonicfan94/determination/contentright2.jpg" width="28" border="0">
</td>

</tr>
<tr>
<td valign="top" height="23" colspan="2" border="0">
<img src="http://img.photobucket.com/albums/v203/sonicfan94/determination/bottom.jpg" height="23" width="599" border="0">
</td>
</tr>
</table>
</body>
boogyman
02-06-2008, 07:45 PM
that site is not coming up.
somethings to take a look at are the cell padding / spacing
and any margins / padding that you may have assigned.
Please try to expand your descriptions of a problem. Saying something is "off" gives us nothing to reference. You know what its supposed to look like, we do not.
html tablesrule
02-15-2008, 06:03 AM
dear sonicfan I found your problem..................
I copied your code here and played around with it until I duplicated your problem at the top of the page by moving a closing </td> tag away from where it was and left some space.


<!------------------- END CONTENT ----------------------->
</td>
<!---------- content right --------->

<td valign="top" border="0">
<img src="http://img.photobucket.com/albums/v203/sonicfan94/determination/contentright2.jpg" width="28" border="0">
</td>
+++++++++++++++++++++++++++++++++++++++++++++++++++++++

HERE'S THE FIX............

<!------------------- END CONTENT ----------------------->
</td>
<!---------- content right --------->

<td valign="top" border="0">
<img src="http://img.photobucket.com/albums/v203/sonicfan94/determination/contentright2.jpg" width="28" border="0"></td>
^^^^^ LOOK HERE ^^^^^^^^^^^
+++++++++++++++++++++++++++++++++++++++++++++++++++++

simply bring the last </td> column tag shown here up and close it off directly
in contact with the content of the <td>keep these tags TIGHT</td>

I have only been learning for a couple of months but ran into a similar problem while working with tables... for some reason, in some cases only, if the closing tag does not directly touch the content you're closing off it will leave a null space beneath the content and the table border, or in your case it split the cell somehow.
Hope I explained this properly.