The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

Conflict between Expanding Menu and Slider Nav

  • # May 16, 2013 at 5:35 pm

    On my site 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.


    # 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{

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


    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.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed