z-index and my table?

[eva21]

JS:

function changeWidth(x)

{

document.getElementById('div').style.display = "block";

document.getElementById('div').style.zIndex = "7";

document.getElementById(x + '_teach').style.width = '';

}

 

PHP/HTML:

<table id="myTable" class="train" width="100%" style="table-layout: fixed; display: block;">

.

.

<div id="div">

<?

echo("<Select size=3 MULTIPLE style='width: 235px; font-size: 9pt;' onMouseover='changeWidth(" . $rows['id'] . ")' onMouseout='changeWidthBack(" . $rows['id'] . ")' onchange='getMedia(" . $rows['id'] . ")' name='" . $rows['id'] . "_t[]' id='" . $rows['id'] . "_t'>");

 

This works fine, but when I hover over the list boxes I want it to go on top of the other cell but not hurting the cell and table size itself. How can i do this?