Thx orpatech.com.
I've increseed the z-index via the "editor" in the "Appearance" section. I'm using "A Simple Love" theme which is the child theme for Thematic. It uses the SuperFish (sf.menu). The "menu" portion in the editor looks like this:
.sf-menu,.sf-menu * {
list-style : none;
margin : 0;
padding : 0;
}
.sf-menu {
line-height : 13px;
}
.sf-menu ul {
position : absolute;
top: -999em;
width : 16em;
}
.sf-menu ul li {
width : 100%;
postition : relative;
z-index : 100;
}
.sf-menu li:hover {
visibility : inherit;
}
.sf-menu li {
float : left;
position : relative;
}
.sf-menu a {
display : block;
position : relative;
}
.sf-menu li:hover ul,.sf-menu li.sfHover ul {
left : 0;
top : 12px;
}
ul.sf-menu li:hover li ul,ul.sf-menu li.sfHover li ul {
top : -999em;
}
ul.sf-menu li li:hover ul,ul.sf-menu li li.sfHover ul {
left : 16em;
top : 0;
}
ul.sf-menu li li:hover li ul,ul.sf-menu li li.sfHover li ul {
top : -999em;
}
ul.sf-menu li li li:hover ul,ul.sf-menu li li li.sfHover ul {
left : 16em;
top : 0;
}
.sf-menu a {
font-family : Helvetica,Arial,Verdana,sans-serif;
padding : 9px 20px;
text-decoration : none;
text-transform : uppercase;
}
.sf-menu a,.sf-menu a:visited {
color : #666;
}
.sf-menu li:hover,.sf-menu li.sfHover,.sf-menu a:focus,.sf-menu a:hover,.sf-menu a:active {
background : #f0f0f0;
outline : 0;
}
.sf-menu ul {
border-bottom : 1px solid #96d1e2;
border-left : 1px solid #96d1e2;
border-right : 1px solid #96d1e2;
}
.sf-menu li:hover ul,.sf-menu li.sfHover ul {
top : 31px;
}
.sf-menu ul ul {
margin-top : 0;
}
.sf-menu ul a {
background : #f0f0f0;
border-bottom : 1px solid #fff;
border-bottom : none;
border-right : 1px solid #fff;
}
.sf-menu ul a:hover {
border-bottom : 1px solid #fff;
border-right : 1px solid #fff;
color : #FF4B33;
}
I've tried increasing the z-index in various portions of the menu so many time I'm not sure which ones I've changed. I know I should have kept better notes. Any suggestions would be appreciated.
Thx,
cleop87