- This topic has 1 reply, 2 voices, and was last updated 16 years, 3 months ago by
.
-
Posts
-
I recently added a horizontal drop down menu to my wordpress blog using the suckerfish plug-in. It works fine enough, but in IE (7, I think) on Windows XP SP2, when the page loads the horizontal menu is shifted roughly 30px or so to the right. When it is moused-over, the entire menu jumps back to its "correct" location.
The blog can be found at http://www.philrules.com/db/
The code:
/* Suckerfish Dropdown Menu Start*/
.suckerfish {
position:relative;
left:0px;
}
#suckerfishnav {
background:#231F20;
font:arial;
width:530px;
margin-top:3px;
padding-bottom:0px;
letter-spacing:1px;
}
#suckerfishnav, #suckerfishnav ul {
background:#231F20;
float:left;
list-style:none;
padding-left:10px;
border:none;
width:575px;
margin-bottom:-50px;
text-align:left;
}
#suckerfishnav a {
display:block;
color:#fff;
text-decoration:none;
padding:2px 0 2px 0;
margin-right:30px;
margin-left:-2px;
padding-left:2px;
}
#suckerfishnav li {
float:left;
padding:0;
}
#suckerfishnav ul {
position:absolute;
left:-999em;
height:auto;
width:110px;
font-weight:normal;
margin-left:-2px;
line-height:1;
border:0;
border-top:none;
}
#suckerfishnav li li {
width:110px;
border:none;
font-weight:normal;
font:arial;
}
#suckerfishnav li li a {
padding:5px 0px 5px 0px;
width:115px;
font:arial;
color:#fff;
margin-left:-8px;
letter-spacing:1px;
}
#suckerfishnav li ul ul {
margin:-20px 0 0 130px;
}
#suckerfishnav li li:hover {
background:red;
margin-left:-10px;
padding-left:10px;
}
#suckerfishnav li ul li:hover a, #suckerfishnav li ul li li:hover a, #suckerfishnav li ul li li li:hover a, #suckerfishnav li ul li li li:hover a {
color:#fff;
}
#suckerfishnav li:hover a, #suckerfishnav li.sfhover a {
color:#fff;
}
#suckerfishnav li:hover li a, #suckerfishnav li li:hover li a, #suckerfishnav li li li:hover li a, #suckerfishnav li li li li:hover li a {
color:#fff;
}
#suckerfishnav li:hover ul ul, #suckerfishnav li:hover ul ul ul, #suckerfishnav li:hover ul ul ul ul, #suckerfishnav li.sfhover ul ul, #suckerfishnav li.sfhover ul ul ul, #suckerfishnav li.sfhover ul ul ul ul {
left:-999em;
}
#suckerfishnav li:hover ul, #suckerfishnav li li:hover ul, #suckerfishnav li li li:hover ul, #suckerfishnav li li li li:hover ul, #suckerfishnav li.sfhover ul, #suckerfishnav li li.sfhover ul, #suckerfishnav li li li.sfhover ul, #suckerfishnav li li li li.sfhover ul {
left:auto;
background:#231F20;
}
#suckerfishnav li:hover, #suckerfishnav li.sfhover {
background:red;
margin-left:-2px;
padding-left:2px;
}
/*Suckerfish dropdown menu end*/
- You must be logged in to reply to this topic.