...

View Full Version : extra margin/padding below li:over in ie?



BroChris
12-26-2005, 03:46 PM
Check the menu on this page in IE: Amber's web site (http://www.chrisandabby.com/amberfaith/). Roll over "About Me" to see the problem.

I adapted the Suckerfish dropdowns (http://www.alistapart.com/articles/dropdowns) by Patrick Griffiths and Dan Webb. Only the "About Me" link currently has a submenu. Works great in Firefox (as usual), but in IE, however, the display:block on the main links (#menu a) causes the links to shift down for some reason.

Some relevant css:


#menu {
width:250px;
height:100%;
background-color:#FFC5C5;
text-align:right;
border-style:solid;
border-color:#FFFFFF;
border-width:0px;
border-top-width:2px;
}
#menu ul {
list-style:none;
}
#menu li {
position:relative;
}
#menu a {
color:#FFFFFF;
font-size:130%;
height:50px;
background-repeat:no-repeat;
border-style:solid;
border-color:#FFFFFF;
border-width:0px;
border-bottom-width:2px;
display:block;
}
#menu #submenu {
position:absolute;
left:250px;
top:0px;
display:none;
}
#menu li:hover #submenu, #menu li.over #submenu {
display:block;
}
#submenu li {
list-style:none;
}
#menu #submenu a {
width:200px;
background-color:#FFC5C5;
text-decoration:none;
font-style:italic;
border-left-width:2px;
padding-left:10px;
padding-right:10px;
}
#menu #submenu a:hover {
background-color:#FFABAB;
}

Shouldn't the fact the submenu is absolutely positioned keep this from happening?

Masterslave
12-26-2005, 04:23 PM
I get this error:

Error: Error in parsing value for property 'clear'. Declaration dropped.
Source File: http://www.chrisandabby.com/amberfaith/includes/style.css
Line: 248
Maybe you should check that.

_Aerospace_Eng_
12-26-2005, 06:31 PM
Add this to your CSS

* html #menu li {
height:1px;
}
Just another bug in IE thats all.

BroChris
12-26-2005, 10:12 PM
It works! Thanks so much.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum