There are three parts to the tab. A right side, a middle and a left side. I can get every part of the tab to change on hover except the right side.
What is wrong with the syntax?
div#sidenavhead {
float: left;
font-size: 10;
font-family: Georgia;
color: #000099;
}
div#sidenavhead ul {
top margin:10;
margin: 0;
padding: 10;
list-style: none;
font-weight: bold;
color: #000099;
}
/* inactive tab style */
div#sidenavhead li{
float: left;
background: url("/emr/main/view/images
/style02_2
_n_right.g
if") no- repeat right top;
margin: 0;
padding:0px 8px 0px 0x;
width: auto;
color: #000099;
}
*/THIS IS THE ONE THAT DOESN'T WORK
div#sidenavhead:hover li{
float: left;
background: url("/emr/main/view/images
/style02_2
_s_right.g
if") no-repeat right top;
margin: 0;
padding:0px 8px 0px 0x;
width: auto;
color: #000099;
}
div#sidenavhead a span{
background-image: url("/emr/main/view/images
/style02_2
_n_back.gi
f");
padding:8px 0px 8px 0px;
width:auto;
}
div#sidenavhead a:hover span{
background-image: url("/emr/main/view/images
/style02_2
_s_back.gi
f");
padding:8px 0px 8px 0px;
width:auto;
}
div#sidenavhead a {
display: block;
padding:8px 6px 8px 14px;
text-decoration: none;
color: #000099;
background: url("/emr/main/view/images
/style02_2
_n_left.gi
f") no-repeat left top;
}
div#sidenavhead a:hover {
display: block;
padding:8px 6px 8px 14px;
text-decoration: none;
color: #000099;
background: url("/emr/main/view/images
/style02_2
_s_left.gi
f") no-repeat left top;
}
/* Active tab style */
div#sidenavhead #active a {
float: right;
margin: 0;
display: block;
padding:8px 8px 8px 14x;
text-decoration: none;
color: #000099;
background: url("/emr/main/view/images
/sideactiv
e_left.gif
") no-repeat left top;
}
div#sidenavhead #active a span {
background-image: url("/emr/main/view/images
/sideactiv
e_back.gif
");
padding:8px 0px 8px 0px;
}
div#sidenavhead #active {
background-image: url("/emr/main/view/images
/sideactiv
e_right.gi
f");
padding:0px 5px 0px 10px;
}