What am I doing wrong with my html/css table?

K

kDb

New member
Here's the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> Obey the Fist </title>
</head>
<style type="text/css">

table{
margin-left:auto;
margin-right:auto;}

td.purple{
background-color:#ffccff;}

</style>
<body>

<table border="0" cellspacing="0">
<tr>
<th colspan="2" style="height:150px"> <a href="index.html"><img src="images/zimbanner.png" alt="zims obey the fist logo" border="0"/></a>
</th>
</tr>

<tr>
<td class="purple">
<a href="index.html"><img src="images/home_button.png" alt="home link" border="0" /></a>
</td>

<td class="purple" >
Blah
</td>
</tr>

<tr>
<td class="purple">
<a href="characters.html"><img src="images/characters_button.png" alt="characters link" border="0"/></a>
</td>
</tr>

<tr>
<td class="purple">
<a href="media_links.html"><img src="images/media_links_button.png" alt="media links link" border="0"/></a>
</td>
</tr>

<tr>
<td class="purple">
blah
</td>
</tr>

</table>
</body>
</html>

The problem with this is that whenever I load it up to check it, the rows in the first column stretch alot farther than their supposed to, making the first "blah" get shunned to the side. What I'm also wanting is my second column (same "blah") to stretch down to the last row in the first column. However, if you load this up, then it acts like it's just one tiny cell. So, can you point out what I'm doing wrong? Is there something I need to add in order to straighten it out? Any help is appreciated, thanks!
 
Back
Top