WordPress.org

1. tazman
   Member
   Posted 2 years ago #

   Hi everyone - I just installed a theme and noticed that the drop down menus disappear behind the page content. You can see it at http://www.robertocerini.com

   Can someone suggest a way to fix it?

   Thanks,

   Rob

2. esmi
   Theme Diva & Forum Moderator
   Posted 2 years ago #

   Checked in FF3, IE8 & IE7. Can't see any problem...

3. tazman
   Member
   Posted 2 years ago #

   Go to "Cooking Videos and Recipes", when the menu opens, highlite "Main Courses" and you'll see what I mean.

   Thanks,

   Rob

4. tazman
   Member
   Posted 2 years ago #

   Anyone?

5. Edward Caissie
   Member
   Posted 2 years ago #

   I see your drop down menus are going below your Google Ads ... and below the YouTube video?

   Troubleshooting: Does this still happen if you remove the Google Ad banner?

   Possible suggestion, increase the z-index on your #navigation element in your CSS, for example:
   

   #navigation {
   ...
   position:relative;
   z-index:100;
   }

   If there there is a z-index value in the Google Ads style then your navigation z-index value will have to be greater. (z-index values must be positive for cross-browser validity)

6. tazman
   Member
   Posted 2 years ago #

   I had tried the z-Index, but regardless of what I use, it still stays behid the google ads and youtube. if I take those out, it's in front.

7. Edward Caissie
   Member
   Posted 2 years ago #

   Perhaps a larger z-index? Using FireFox and FireBug lead me to this around line 237 in your style.css file:

   ul#category-list ul {
   background-color:#A9AC92;
   display:none;
   margin:3px 0 0 -7px;
   position:absolute;
   z-index:10000;
   }

   Add the z-index line as the above example and it will hopefully sort out your issue.

   PS: Before this "fix" it is only the Google Ad that is on "top" of the menu, your videos are underneath the drop downs.

8. asechrest
   Member
   Posted 2 years ago #

   Confirming that cais' solution works.

   Find the section of code he indicates and add the z-index value. z-index: 100; works fine.

9. iridiax
   Member
   Posted 2 years ago #

   Move the ads away from your menus. It's a violation of Adsense program policies since it can lead to accidental clicks on ads:

   Google ads, search boxes or search results may not be:
   * Obscured by elements on a page.

10. Edward Caissie
    Member
    Posted 2 years ago #

    @iridiax - Nice find on the Google policy. Good information to share.

11. tazman
    Member
    Posted 2 years ago #

    They are at the bottom of the posts. Nonetheless adding z-index still keeps the menu behind the youtube video.

12. tazman
    Member
    Posted 2 years ago #

    There is something about youtube that puts it in front of everything else. This is really frustrating!!!

13. tazman
    Member
    Posted 2 years ago #

    BTW, the policy says the opposite of what you write. They don't want your page content to be on top of the ads in a way that you may click on the ad without knowing it.

14. asechrest
    Member
    Posted 2 years ago #

    Tazman,

    After some research, I found the solution to preventing Youtube videos from hiding page objects and posted it for my readers. See if it helps you out.

15. tazman
    Member
    Posted 2 years ago #

    Thanks asechrest, but it still does not work. :-(

16. asechrest
    Member
    Posted 2 years ago #

    Responded to you on my site. I downloaded your theme, used your Youtube video, and was able to get this to work (see my response on my website, it links to a screenshot).

    I'm struggling to determine why it's not working for you. I've viewed your source code and the embed code appears to be fine. Strange!

17. asechrest
    Member
    Posted 2 years ago #

    Tazman,

    I think your issue is with curly quotes. Curly quotes were used in the code you inserted into the Youtube embed and this is causing the problem to persist. See my comment on how to fix.

18. asechrest
    Member
    Posted 2 years ago #

    This is resolved. The solution was editing the Youtube embed code to add transparency.

Topic Closed

This topic has been closed to new replies.