...

View Full Version : CSS drop down menu not functioning in footer



cbombard
08-25-2010, 06:21 PM
The CSS I found for a drop down menu works when positioned at the top of the page. (ww.remadedesign.com/testdropdown3.html) However, when placed in the footer (ww.remadedesign.com/testdropdown2.html), where I need it to be, the drop down doesn't appear long enough to be clicked on.

do i need to adjust my footer or the code for the drop down menu?

Thanks in advance!

CSS for footer:
#bottom {
background-color:#FFFFCC;
position: absolute; /* ie6 value b/c !important ignored */
width: 100%;
bottom: 0px;
z-index: 5;
height:100px;
}

CSS for drop down
#nav {
margin: 0;
padding: 0;
}

#nav li ul {
margin: 0;
padding: 0;
display: none;
color: #999999;
}

#nav a {
text-decoration: none;
}

#nav li { /*float the main list items*/
margin: 0;
float: left;
display: block;

font-family: Arial, Helvetica, sans-serif

}



#nav li ul { /*put the subnav below*/
position: absolute;
top: 33px;
*top: 44px;
left: 5px;
padding-top: 10px;
height: 10px;
width: 1000px;

}

#nav li a {
font-size: 10px;
color: #999999;
display: block;
height: 15px;
width: 100px;
padding: 5px;

}



#nav li ul a {
float: left; /*ie doesn't inherit the float*/
border: 0;

width: auto;
margin-right: 15px;
}



#nav li:hover ul {
/*put the subnav below*/
top: 33px;
*top: 44px; /*reposition for IE*/

display: block;
z-index: 6000;
}


#nav li:hover ul, #nav li.over ul {
display: block;
z-index: 6000;
}

abduraooft
08-26-2010, 08:51 AM
The best idea is to reduce the space in between the parent list and child list. For this, remove the padding-top from #nav li ul and reduce the value of top



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum