DropDown menu appears *under* FCG

[Rigel7]

Hi, I'm using WP 2.7 and RevolutionNews-40 (R1). I replaced the existing "Featured" in RevolutionNews (tabber) with FCG. Only one line of code, worked right off the bat. But...

With FCG installed near the top of my home page content, when I mouseover a navigation menu item that has children, the dropdown loads under the FCG window. This is in FireFox3 and IE6 (see attachment)

Education, under the "Government" menu, is partially hidden behind Featured Content Gallery

dropdown.jpg (32.74 KiB) Viewed 2445 times

I figured this might be a z-index issue and I found the code in jd.gallery.css.php which controls that, but changing it down to 0 did nothing, and going to -1 made the gallery disappear.

Any way to fix this?

Thanks,

Marcus

[Dotman]

I'm having the same problem. menus behind in FF 2 and 3 for both mac and pc, and safari as well. Brian posted some changes tothe #nav css that was supposed to fix this at revolutiontheme.com, but it didn't work for me. I hope the deveoper will chime in with a fix.

[admin]

Code: Select all

Hi Dotman,
in your case, if your site is http://apolloalliance.org/, then to fix your issue, you have to go to your theme style.css and and find line:

Code: Select all

#nav li ul {
   position: absolute;
   width:10em;
   left:-999em;
   z-index:2;
   }

and change z-index for big value, for example 100: z-index:100;. This is for you main menu.

Then find line:

Code: Select all

#subnav li ul{
   position:relative;
   z-index:1;}

and change z-index to 101(for example). This is for subnav menu.

And both of your menus will go on top of fcg.

And also, one suggestion. I have Firefox web developer toolbar installed, which is really helpful tool for finding any issues of the website. I even was able to edit css in browser. In such way I tested your site and with changes I provided above, all your menus shown on top of fcg.

[admin]

Marcus, if your site is http://washingtonstate.org/. Go to your style.css add

Code: Select all

z-index:100;

in to this style.

Code: Select all

#nav li ul {
   position: absolute;
   width: 10em;
   left: -999em;
   }

Also, add

Code: Select all

z-index:101;

to below style:

Code: Select all

#subnav li ul {
   position: absolute;
   width: 10em;
   left: -999em;
   }

[drc2100]

Thank you. Very helpful. This fixed our problem at http://www.findbliss.com

[Dotman]

That didn't fix it for me. I know another on our staff my have added a z index to some other #nav and #subnav classes. Would you mind taking a look at the css one more time to make sure something isn't overriding your change? Really appreciate it. It's a very nice plugin and I'd like to get this working. And you are correct, the site is http://apolloalliance.org. Thanks.

css file removed by admin

[admin]

I just downloaded your style.css file from your site and I do not see the changes, which I suggested in above posts. I still see

Code: Select all

#nav li ul {
   position: absolute;
   width:10em;
   left:-999em;
   z-index:2;
   }

where z-index should be 100,

and

Code: Select all

#subnav li ul{
   position:relative;
   z-index:1;}

where z-index should be 101
Are you sure you updated the css?
You should update this file
http://apolloalliance.org/wp-content/th ... /style.css

[Dotman]

I am so stupid I was updating the css test file. Works fine now. Thanks again.

[Dotman]

Just noticed that the top nav in FF 2 and 3 on the PC is under the Gallery, but the subnav is above. did I miss something? The correct css file was updated. Thanks for checking.

[admin]

In firefox3 all menus are on top, but in firefox2 your problem persists
in code

Code: Select all

#navbar {
   width: 960px;
   height: 29px;
   font-size: 11px;
   font-family: Arial, Tahoma, Verdana;
   color: #FFFFFF;
   font-weight: bold;
   margin: 0px auto 0px;
   padding: 0px 0px 0px 0px;
   overflow: hidden;
   background-color: #000000;
   background-image: url(images/nav_bg_1.jpg);
   background-repeat: repeat-x;

   }

remove overflow: hidden;
and everything should be fine. This change will make firefox2 work properly. But anyway before you do anything backup style.css file in case. Also, test it in other browsers.