How to Display Drop Down Menus in Front of Featured Content

[Brian Gardner]

When using the Featured Content plugin on a homepage, the drop down menus will display behind it. Take a look at the current CSS code below for the #navbar:

#nav li {
float: left;
margin: 0px;
padding: 0px;
}

#nav li li {
float: left;
margin: 0px;
padding: 0px;
width: 150px;
}

You should add two lines to each, and it should now look like this:

#nav li {
float: left;
margin: 0px;
padding: 0px;
z-index: 15;
position: relative;
}

#nav li li {
float: left;
margin: 0px;
padding: 0px;
width: 150px;
z-index: 10;
position: relative;
}

Likewise, you will need to do the same with the #subnav. Here's what the current code looks like:

#subnav li {
float: left;
margin: 0px;
padding: 0px;
}

#subnav li li {
float: left;
margin: 0px;
padding: 0px;
width: 140px;
}

And it should look like this:

#subnav li {
float: left;
margin: 0px;
padding: 0px;
z-index: 14;
position: relative;
}

#subnav li li {
float: left;
margin: 0px;
padding: 0px;
width: 140px;
z-index: 10;
position: relative;
}