WordPress.org

1. tazman
   Member
   Posted 4 months 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
   Member
   Posted 4 months ago #

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

3. tazman
   Member
   Posted 4 months 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 4 months ago #

   Anyone?

5. cais
   Member
   Posted 4 months 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 4 months 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. cais
   Member
   Posted 4 months 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 4 months 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 4 months 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. cais
    Member
    Posted 4 months ago #

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

11. tazman
    Member
    Posted 4 months 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 4 months ago #

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

13. tazman
    Member
    Posted 4 months 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 4 months 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 4 months ago #

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

16. asechrest
    Member
    Posted 4 months 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 4 months 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 4 months ago #

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

Reply

You must log in to post.