I have a menu which drops down... when the menu drops.. each item to select is spaced.. I was wondering is there a way I can fill those spaces in with a color..
I want to do this because.. now when i mouse over and it drops.. but if I have an image or some wording behind it.. Those blank lines that seperate the items in my drop down menu shows up in between those lines....
heres my code...
<html>
<head>
<style>
a.menuNav {
color:black;
text-decoration:none;
font:normal 5pt Verdana, Arial;
backgroundrange;
width:100%;
height:100%;
padding:2 2 2 2;/*use this here to give the space between links. (top,right,bottom,left)*/
}
a.menuNav:hover{
text-decoration:none;
background:#FFcc66;
color:black;
}
table.menu
{
font-size:100%;
position:absolute;
visibility:hidden;
}
</style>
<script type="text/javascript">
function showmenu(elmnt)
{
document.all(elmnt).style.visibility="visible"
}
function hidemenu(elmnt)
{
document.all(elmnt).style.visibility="hidden"
}
</script>
</head>
<body>
<table cellspacing="0" cellpadding="0" border="0" width="750">
<tr>
<td onmouseover="showmenu('menu1')" onmouseout="hidemenu('menu1')" width="127" >
<img border="0" src="business_logo.bmp" width="125" height="19"><br />
<table class="menu" id="menu1" width="125" cellspacing="1" cellpadding="0" >
<tr><td ><a class="menuNav" href="../html"><font size="1" color="#000000">Adipure</a></font></td></tr>
<tr><td ><a class="menuNav" href="../xhtml"><font size="1" color="#000000">BSD</a></td></tr>
<tr><td ><a class="menuNav" href="../css"><font size="1" color="#000000">Building 5 NIL</a></td></tr>
<tr><td ><a class="menuNav" href="../xml"><font size="1" color="#000000">CAD</a></td></tr>
</table>
</td>
</tr>
</table>
</body>
Thanks
I dont know if I posted in the right forum.. maybe i can try script forum also...
I want to do this because.. now when i mouse over and it drops.. but if I have an image or some wording behind it.. Those blank lines that seperate the items in my drop down menu shows up in between those lines....
heres my code...
<html>
<head>
<style>
a.menuNav {
color:black;
text-decoration:none;
font:normal 5pt Verdana, Arial;
backgroundrange;
width:100%;
height:100%;
padding:2 2 2 2;/*use this here to give the space between links. (top,right,bottom,left)*/
}
a.menuNav:hover{
text-decoration:none;
background:#FFcc66;
color:black;
}
table.menu
{
font-size:100%;
position:absolute;
visibility:hidden;
}
</style>
<script type="text/javascript">
function showmenu(elmnt)
{
document.all(elmnt).style.visibility="visible"
}
function hidemenu(elmnt)
{
document.all(elmnt).style.visibility="hidden"
}
</script>
</head>
<body>
<table cellspacing="0" cellpadding="0" border="0" width="750">
<tr>
<td onmouseover="showmenu('menu1')" onmouseout="hidemenu('menu1')" width="127" >
<img border="0" src="business_logo.bmp" width="125" height="19"><br />
<table class="menu" id="menu1" width="125" cellspacing="1" cellpadding="0" >
<tr><td ><a class="menuNav" href="../html"><font size="1" color="#000000">Adipure</a></font></td></tr>
<tr><td ><a class="menuNav" href="../xhtml"><font size="1" color="#000000">BSD</a></td></tr>
<tr><td ><a class="menuNav" href="../css"><font size="1" color="#000000">Building 5 NIL</a></td></tr>
<tr><td ><a class="menuNav" href="../xml"><font size="1" color="#000000">CAD</a></td></tr>
</table>
</td>
</tr>
</table>
</body>
Thanks
I dont know if I posted in the right forum.. maybe i can try script forum also...