I am trying to modify a style sheet that applies styling
to a (XML based drop-down menu). I want the background
color on my menus to change and a border to be applied on
all sides ONLY on the hover/mouseover event.
I am using IE 5.5, and although I am able to apply borders
that always stay there, and the color to the static class
for the menu DIV, I don't know how to apply the changes
only on the hover/mouseover event...
here is the code...
>>>
/* Actual Menu Bar */
DIV#divMenuBar
{
background-color:#eee;
}
TABLE#tblMenuBar TD
{
font-size:60%;
height:23px;
color:green;
padding:0px 5px 0px 5px;
cursor:default;
/* border:#666 solid 1px; */
}
TABLE#tblMenuBar TD.clsMenuBarItem
{
font-weight:bold;
cursor:hand;
}
/* Menu drop-downs... */
DIV.clsMenu
{
font-size:90%;
background-color:#eee;
position:absolute;
visibility:hidden;
width:130px;
padding:5px 5px 5px 8px;
/* borders on the drop-downs ... */
border-top:1 black solid;
border-left:1 black solid;
border-right:1 black solid;
border-bottom:1 black solid;
/* Here is the code to apply the shadow on the drop-
downs... */
filter:progid:DXImageTransform.Microsoft.dropShadow
(Color=999999,offX=3,offY=3,positive=true);
}
/* individual menu-items */
DIV.clsMenu A
{
text-decoration:none;
color:black;
height:76px
border:#eee solid 1px;
width:=130px
/*font-weight:bold; */
}
DIV.clsMenu A:hover
{
color:blue;
border:#00c solid 1px;
background-color:#9cf;
}
<<<
so in the 'TABLE#tblMenuBar TD.clsMenuBarItem ' style I
tried to apply borders and backgrounds, but I want them
only on the mouseover, or hover. So how can I write this
so it does that?
Thanks for any help or assistance
Philip Livingstone