z-index of individual menu links

  • So I’ve made this tabbed menu for the website of my wife. (see: acupoflife.nl)

    If you look closely, you’ll see four items in the following order:
    home
    do-it-yourself
    recepten
    fashion

    But unfortunately, ‘fashion’ is the top-tab (if you catch my drift). You’ll see that ‘recepten’ slides below ‘fashion’, and do-it-yourself slides below that one. Lastly ‘home’ slides below ‘do-it-yourself’ (unless it is active).

    So what I’m looking for is a way to make home the top-tab, followed by do-it-yourself, recepten and lastly fashion. Is there a way to z-index the individual links?

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

  • Hi,
    I suppose you could use css3 properties like, nth-child etc. But might not be the ideal way of doing it.

    Cheers..:)..

    Thread Starter Jummul

    (@jummul)

    Hmm, anyone else has an idea? Not so familiar with CSS3….. Plus I need as much browser compatibility as possible.

    Well one way you can do this is if you can alter the z-index of each of the links separately.
    You can do this from your dashboard by going into the Appearence>>menu
    and clicking screen options at the top right hand side.
    And checking the CSS Classes checkbox.
    This will enable a css class field under the menu items, so from there you can put a specific class to each item and can change the z-index thereof.

    Cheers..:)..

    Thread Starter Jummul

    (@jummul)

    Sounds promising! I will update if it works!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘z-index of individual menu links’ is closed to new replies.