Any help would be a tremendous help in resolving this problem which is trying to make the menus appear under the images, though as far as is known the menus are aligning themselves with the BODY tag asopposed to the images.
Here is my big long piece of code with a internal style sheet: Any help would be great:

<!DOCTYPE HTML PUBLIC "-W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<LINK href="menurollover.css" type=text/css rel=STYLESHEET>
<SCRIPT LANGUAGE=JavaScript>
if (!(document.all))
{
if (document.layers)
{
window.location.replace("NNMenus.htm");
}
else
{
window.location.replace("textonly.htm");
}
}


var woodMenuItems = new Array();
woodMenuItems[0] = new Array();

woodMenuItems[0][0] = "History";
woodMenuItems[0][1] = "History.htm";
woodMenuItems[0][2] = "Company History";

woodMenuItems[1] = new Array();
woodMenuItems[1][0] = "Staff";
woodMenuItems[1][1] = "Staff.htm";
woodMenuItems[1][2] = "Meet the Staff";

woodMenuItems[2] = new Array();
woodMenuItems[2][0] = "Contact";
woodMenuItems[2][1] = "Contact.htm";
woodMenuItems[2][2] = "Contact Details";

// Second menu
var metalMenuItems = new Array();
metalMenuItems[0] = new Array();

metalMenuItems[0][0] = "Samkou";
metalMenuItems[0][1] = "http://www.samkou.com";
metalMenuItems[0][2] = "Samkou Export co.";

metalMenuItems[1] = new Array();
metalMenuItems[1][0] = "Olivier";
metalMenuItems[1][1] = "http://www.olivierMorosini.co.uk";
metalMenuItems[1][2] = "Olivier Morosini Hair Studio";

metalMenuItems[2] = new Array();
metalMenuItems[2][0] = "ABI";
metalMenuItems[2][1] = "http://www.abisoft.net/intro.htm";
metalMenuItems[2][2] = "ABI Software Development";

var bricksMenuItems= new Array();
bricksMenuItems[0] = new Array();

bricksMenuItems[0][0] = "Jigsaw";
bricksMenuItems[0][1] = "Jigsaw.htm";
bricksMenuItems[0][2] = "ICON Jigsaw game";

bricksMenuItems[1] = new Array();
bricksMenuItems[1][0] = "cargame";
bricksMenuItems[1][1] = "cargame.htm";
bricksMenuItems[1][2] = "ICON racing game";

bricksMenuItems[2] = new Array();
bricksMenuItems[2][0] = "Adventure";
bricksMenuItems[2][1] = "adventure.htm";
bricksMenuItems[2][2] = "ICON Adventure game";

var ecMenuItems= new Array();
ecMenuItems[0] = new Array();

ecMenuItems[0][0] = "VeryCherry";
ecMenuItems[0][1] = "http://www.verycherry.co.uk";
ecMenuItems[0][2] = "Very Cherry";

ecMenuItems[1] = new Array();
ecMenuItems[1][0] = "Belagio";
ecMenuItems[1][1] = "http://www.belagio.co.uk";
ecMenuItems[1][2] = "Belagio watches";

var legalMenuItems= new Array();
legalMenuItems[0] = new Array();

legalMenuItems[0][0] = "copyright";
legalMenuItems[0][1] = "copyright.htm";
legalMenuItems[0][2] = "Copyright and Disclaimer";

legalMenuItems[1] = new Array();
legalMenuItems[1][0] = "privacy";
legalMenuItems[1][1] = "privacy.htm";
legalMenuItems[1][2] = "Privacy Policy";

legalMenuItems[2] = new Array();
legalMenuItems[2][0] = "Disability";
legalMenuItems[2][1] = "disability.htm";
legalMenuItems[2][2] = "Discrimination Act 2002";


function createMenu(menuName, menuItems)
{
var divHTML = '<DIV ID="' + menuName + 'MenuDiv" CLASS="DivMenu"';
divHTML = divHTML + ' onmouseout="return hideMenu(this)">';

var tableHTML = '<TABLE BORDER=0 CELLSPACING=1 CELLPADDING=1 ID="'
+ menuName + 'Table">';
var tableRowHTML = "";
var rowCount;
var totalNoRows = menuItems.length;
for (rowCount = 0; rowCount < totalNoRows; rowCount++)
{
tableRowHTML = tableRowHTML + '<TR><TD ID="' +
menuName + menuItems[rowCount][0] +
'" RollOver RollOut';
tableRowHTML = tableRowHTML + ' onclick="goPage(\''
+ menuItems[rowCount][1] + '\')"';
tableRowHTML = tableRowHTML
+ 'CLASS="TDMenu">' + menuItems[rowCount][2]
+ '</TD></TR>';
}

return divHTML + tableHTML + tableRowHTML + '</TABLE></DIV>';
}


function showMenu(menuToShow)
{
var srcElement = event.srcElement;
var xPos = parseInt(srcElement.offsetLeft);
var yPos = parseInt(srcElement.offsetTop);

menuToShow.style.left = xPos + (srcElement.width)
menuToShow.style.top = yPos;
}

function hideMenu(menuToHide)
{
if (event.toElement != menuToHide &&
menuToHide.contains(event.toElement) == false)
{
menuToHide.style.left = -200;
menuToHide.style.top = -1000;
}
}

function document_onmouseover()
{
var srcElement = event.srcElement;

if (srcElement.tagName == "TD" && typeof(srcElement.RollOver) != "undefined")
{
srcElement.style.color = "white";
srcElement.style.backgroundColor ="black";
}
}

function document_onmouseout()
{
var srcElement = event.srcElement;
if (srcElement.tagName == "TD" && typeof(srcElement.RollOut) != "undefined")
{
srcElement.style.color = "black";
srcElement.style.backgroundColor = "gray";
}
}

function goPage(src)
{
window.location.href = src;
}

document.onmouseover = document_onmouseover;
document.onmouseout = document_onmouseout;
</SCRIPT>

<STYLE>
.DivMenu {position:absolute;
left:-200;
top:-1000;
width:100;
z-index:100;
background-color:black;
border: 4px groove lightgrey;
}

.TDMenu {
color:silver;
font-family:arial;
font-size:70%;
width:100%;
cursor:default;
}
</STYLE>
</head>

<body lang="EN" bgcolor="#FFFFFF" text="#000000">
<SCRIPT LANGUAGE=JavaScript>
document.write(createMenu('Wood', woodMenuItems))
document.write(createMenu('Metal', metalMenuItems))
document.write(createMenu('Bricks', bricksMenuItems))
document.write(createMenu('ec', ecMenuItems))
document.write(createMenu('legal', legalMenuItems))
</SCRIPT>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<table width="57%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td width="15%">&nbsp;</td>
<td width="15%">&nbsp;</td>
<td width="15%">&nbsp;</td>
<td width="15%">&nbsp;</td>
<td width="13%">&nbsp;</td>
<td width="16%">&nbsp;</td>
</tr>
<tr>
<td width="15%"><IMG ID="WoodMenuImage"
SRC="about.gif"
onmouseover="return showMenu(WoodMenuDiv)"
onmouseout="return hideMenu(WoodMenuDiv)"></td>
<td width="15%"><img ID="contries" src="countrysites.gif" width="100" height="40" align="middle" alt="Other country/language supported home pages" onmouseover="return showmenu(countryDiv)" onmouseout=" return hidemenu(countryDiv, 4)"></td>
<td width="15%"><IMG ID="MetalMenuImage"
SRC="portfolio.gif"
onmouseover="return showMenu(MetalMenuDiv)"
onmouseout="return hideMenu(MetalMenuDiv)"></td>
<td width="15%"><IMG ID="ecMenuImage"
SRC="ecommerce.gif"
onmouseover="return showMenu(ecMenuDiv)"
onmouseout="return hideMenu(ecMenuDiv)"></td>
<td width="13%"><IMG ID="BricksMenuImage"
SRC="games.gif"
onmouseover="return showMenu(BricksMenuDiv)"
onmouseout="return hideMenu(BricksMenuDiv)"></td>
<td width="16%"><IMG ID="legalMenuImage"
SRC="llegal.gif"
onmouseover="return showMenu(legalMenuDiv)"
onmouseout="return hideMenu(legalMenuDiv)" width="100" height="40"></td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>