css table help

[Firewireguy]

Right I have this page:

http://www.philybaby.co.uk/index.php?function=pictures&group=2

now it works great in Mozilla, however in IE it fails miserably.

The html is:


<table class="pictures" align="center">
<tr>
<td class="addNewPicsTableCell">
<div class="addNewPicsDiv">
<a href="./pictures/107_0794-small.jpg">
<img src="picresizer.php?imgfile=./pictures/107_0794-small.jpg&amp;newheight=100" alt="./pictures/107_0794-small.jpg">
</a>
</div>
</td>
<td class="addNewPicsTableCell">
<div class="addNewPicsDiv">
<a href="./pictures/AutoTrader.jpg">
<img src="picresizer.php?imgfile=./pictures/AutoTrader.jpg&amp;newheight=100" alt="./pictures/AutoTrader.jpg">
</a>
</div>
</td>
<td class="addNewPicsTableCell">
<div class="addNewPicsDiv">
<a href="./pictures/DorkTower146.jpg">
<img src="picresizer.php?imgfile=./pictures/DorkTower146.jpg&amp;newheight=100" alt="./pictures/DorkTower146.jpg">
</a>
</div>
</td>
</tr>
<tr>
<td class="addNewPicsTableCell">
<div class="addNewPicsDiv">
<a href="./pictures/IMG_2590-sm.JPG">
<img src="picresizer.php?imgfile=./pictures/IMG_2590-sm.JPG&amp;newheight=100" alt="./pictures/IMG_2590-sm.JPG">
</a>
</div>
</td>
<td class="addNewPicsTableCell">
<div class="addNewPicsDiv">
<a href="./pictures/Image054.jpg">
<img src="picresizer.php?imgfile=./pictures/Image054.jpg&amp;newheight=100" alt="./pictures/Image054.jpg">
</a>
</div>
</td>
<td class="addNewPicsTableCell">
<div class="addNewPicsDiv">
<a href="./pictures/Thong_and_Great_***.jpg">
<img src="picresizer.php?imgfile=./pictures/Thong_and_Great_***.jpg&amp;newheight=100" alt="./pictures/Thong_and_Great_***.jpg">
</a>
</div>
</td>
</tr>
<tr>
<td class="addNewPicsTableCell">
<div class="addNewPicsDiv">
<a href="./pictures/ThreadRocks.jpg">
<img src="picresizer.php?imgfile=./pictures/ThreadRocks.jpg&amp;newheight=100" alt="./pictures/ThreadRocks.jpg">
</a>
</div>
</td>
<td class="addNewPicsTableCell">
<div class="addNewPicsDiv">
<a href="./pictures/WeSee1.jpg">
<img src="picresizer.php?imgfile=./pictures/WeSee1.jpg&amp;newheight=100" alt="./pictures/WeSee1.jpg">
</a>
</div>
</td>
<td class="addNewPicsTableCell">
<div class="addNewPicsDiv">
<a href="./pictures/WeSee2.jpg">
<img src="picresizer.php?imgfile=./pictures/WeSee2.jpg&amp;newheight=100" alt="./pictures/WeSee2.jpg">
</a>
</div>
</td>
</tr>
<tr>
<td class="addNewPicsTableCell">
<div class="addNewPicsDiv">
<a href="./pictures/Wesee12.jpg">
<img src="picresizer.php?imgfile=./pictures/Wesee12.jpg&amp;newheight=100" alt="./pictures/Wesee12.jpg">
</a>
</div>
</td>
<td class="addNewPicsTableCell">
<div class="addNewPicsDiv">
<a href="./pictures/Wesee4.jpg">
<img src="picresizer.php?imgfile=./pictures/Wesee4.jpg&amp;newheight=100" alt="./pictures/Wesee4.jpg">
</a>
</div>
</td>
<td class="addNewPicsTableCell">
<div class="addNewPicsDiv">
<a href="./pictures/Wesee5.jpg">
<img src="picresizer.php?imgfile=./pictures/Wesee5.jpg&amp;newheight=100" alt="./pictures/Wesee5.jpg">
</a>
</div>
</td>
</tr>
</table>
<snip>

and the relevent CSS is currently:



div.addNewPicsDiv {
text-align: center;
background-color: #FFFFFF;
border: 1px solid;
height: 140px;
width: 150px;
top: 1px;
bottom: 1px;
left: 1px;
right: 1px;
padding-left: 5px;
padding-right: 5px;
padding-top: 5px;
padding-bottom: 5px;
position: relative;
visibility: visible;
overflow: hidden;
}

td.addNewPicsTableCell {
width: 150px;
text-align: left;
}

table.pictures {
width: 599px;
text-align: center;
}


now why the dickens does this mess up in IE?

HELP!!!!


TIA