AW.UI.Button floats on top problem - z-index??

i just tried putting 2 UI buttons on my page and everything works great. however there is a popup window that is driven by CSS. when it is displayed the button is on top of the popup, whereas i expect them to stay at the same level as the main page.

here is a link of the screen shot:
http://pic20.picturetrail.com/VOL22/543225/792958/289221360.jpg

the buttons themselves are pretty standard:
<TABLE WIDTH="622" CELLPADDING="0" CELLSPACING="0" BORDER="0">
<tr>
<td align=center>
<script>
var button1 = new AW.UI.Button;
button1.setControlText("Site Information");
button1.setControlImage("site");
document.write(button1);
var button2 = new AW.UI.Button;
button2.setControlText("Project Planning");
button2.setControlImage("planning");
document.write(button2);
button2.onClick = function(text){ location.href='somelink'; }
button2.onClick = function(text){ location.href='somelink'; }
</script>
</td>
</tr>
</table>

i am gussing it has something to do with the z-index??? but i really have no idea - any help is appreciated.

Yes, this is z-index issue. AW.UI.Button has z-index 0, but it could be still on top of the div with the same z-index because it is inserted after it in the DOM tree. Also don't forget that z-index is only applied to the elements with position:absolute or position:relative.

thank you alex - that explains it. is there any way to set the position or z-index of the buttons? are there any setStyle type of function for buttons? thanks!