IE Width problem

[joey]

Hi

I have created a tab menu usings javascript which works perfectly in firefox.

But after I finished it I checked it in IE and it streches right accross the screen and after hours of trying different css and xhtml combinations i can't get it in the centre of the screen.

The div tag should be 617px wide which is firefox does fine but i can't get ie to do it?

Is it a bug or am i missing something really simple?

The web page is http://www.abstractelectronics.co.uk/products.php

Thanks for your help

Regards

Joey

[craig]

First of all, try and get out of using tables.

Try replacing your drawTabs function from this...

function drawTabs() {

document.write("<div align=\left\" <table align=\"left\" width=\"617\" cellspacing=0 cellpadding=0 border=0><tr>");
for (var x = 0; x < tabs.length; x++) {
document.write("<td align=\"left\" ><a href='javascript:switchTab("+x+")'><img name='tab"+x+"' border=0 src="+tabs[x][0]+"></a></td></div>");
}
document.write("</td></tr></table>");
document.images["tab0"].src = tabs[0][1];
document.getElementById("contenttab0").style.display = "block";

}

to this...

function drawTabs() {

document.write("<div align=\left\"><table align=\"left\" width=\"617\" cellspacing=0 cellpadding=0 border=0><tr>");
for (var x = 0; x < tabs.length; x++) {
document.write("<td align=\"left\" ><a href='javascript:switchTab("+x+")'><img name='tab"+x+"' border=0 src="+tabs[x][0]+" /></a></td>");
}
document.write("</td></tr></table></div>");
document.images["tab0"].src = tabs[0][1];
document.getElementById("contenttab0").style.display = "block";

}

That MIGHT work, let me know if it doesn't.