SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Dec 2013
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS nav bar hidden behind other content.

    After hours of trying out different code placement for z-index's, html replacement, etc. I've given up and decided to just ask the experts.

    I have been unable to get my nav bar drop menu items out from behind my content on my Blogger. Here is the page: ampvibe.blogspot.com Hover over the tabs and you'll soon see my predicament.



    Hopefully you can help me out!
    Last edited by Mittineague; Dec 19, 2013 at 14:59. Reason: rem moot

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,118
    Mentioned
    448 Post(s)
    Tagged
    8 Thread(s)
    Hi Jmatty. Welcome to the forums.

    The first problem there is the overflow: hidden here (line 315f):

    Code:
    .tabs-outer {
    overflow: hidden;
    position: relative;
    background: #000 none repeat scroll 0 0;
    }
    Remove that, and the drop downs won't be cut off any more. There are still other things to fix after that, though. The dropdowns still won't work properly because the content below them overlaps. So add a z-index as well:

    Code:
    .tabs-outer {
    position: relative;
    background: #000 none repeat scroll 0 0;
    z-index: 100;
    }
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Forum Usage: Tips on posting code samples, images and more

    Forrest Gump: "IE is like a box of chocolates: you never know what you're gonna get."


Tags for this Thread

Bookmarks

Posting Permissions

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