Grow your CSS skills. Land your dream job.

Conflict between Expanding Menu and Slider Nav

  • # May 16, 2013 at 5:35 pm

    On my site http://tuffymcpuggles.com the homepage features a slider with left and right arrows for navigation between images. I also have an expanding menu, like a mega menu and I want the menu to always sit on top of everything, but in the left arrow location there is a conflict where the left arrow and men’s menu meet.

    The left arrow is on top of the menu and it is not desired. Please help me solve this.

    Best,
    Jon

    # May 16, 2013 at 6:05 pm

    your slider arrows for some reason have a z index of 1000 and if its lower than 3 they disappear

    change the z-index from

    div.slider-nav span{
    z-index:3;
    }

    and z index from first expanding menu to something bigger than 3

    #tb1{
    z-index:5
    }

    note that you will have to change the last menu item too if you want it to expand

    # May 18, 2013 at 6:53 pm

    I will give that a try. Thank you for your solutions.

    # May 18, 2013 at 7:11 pm

    Thank you that worked.

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".