Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    Regular Coder
    Join Date
    Aug 2009
    Posts
    407
    Thanks
    119
    Thanked 0 Times in 0 Posts

    need dropdown to appear in front

    i'm using the process outlined here (http://wphacks.com/how-to-make-categ...rop-down-menu/) to create the horizontal category navigation bar on this site: http://castilloleathergoods.com/.

    "Pool Cue Cases" is the only category that has any child categories so when you hover over that heading, you'll see the dropdown.

    In Internet Explorer, part of the dropdown gets covered by the rotating image gallery plugin on the homepage. what do i do so that the dropdown appears in FRONT of this content???

    please advise. thanks.

  • #2
    Regular Coder
    Join Date
    Apr 2008
    Posts
    685
    Thanks
    15
    Thanked 105 Times in 104 Posts
    You need to set the z-index of your navigation menu so that it has a higher stacking order than the gallery. Therefore adding something like:

    Code:
    #navigation{ position:relative; z-index:100; }
    Should do the trick. The position:relative; is there because the z-index of an element can only be set on elements which are positioned.

  • #3
    Regular Coder
    Join Date
    Aug 2009
    Posts
    407
    Thanks
    119
    Thanked 0 Times in 0 Posts
    thanks. but no dice. it doesnt seem to be working in Firefox either.

    please advise.

  • #4
    Regular Coder
    Join Date
    Apr 2008
    Posts
    685
    Thanks
    15
    Thanked 105 Times in 104 Posts
    Well if I add the line I posted above to the bottom of your screen.css it works in Firefox for me.............

  • #5
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,853
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Have a try by setting position:relative;z-index:10; to #navigation li
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • Users who have thanked abduraooft for this post:

    sixrfan (06-04-2010)

  • #6
    Regular Coder
    Join Date
    Apr 2008
    Posts
    685
    Thanks
    15
    Thanked 105 Times in 104 Posts
    Yeah this procedure is also described in one of the comments from the article you used if it helps at all.

  • #7
    Regular Coder
    Join Date
    Aug 2009
    Posts
    407
    Thanks
    119
    Thanked 0 Times in 0 Posts
    this seems to have worked.

    Code:
    #navigation li ul { z-index:5; }
    on a related topic though, how do I make it so that some sort of indicator (i.e. >> or ↓ or ▼) appears right next to that heading so that visitors know to hover over it to see the dropdown????


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •