[Support request] Main Menu vertical separators between the menu items

[kernfunke]

Hi there,
here’s the css code for the vertical separator lines between the menu items in the main menu. It generally creates a vertical line after each menu item (on the right side). But after the last menu item, which is “KONTAKT”, I don’t want this line to appear. How can I fix this?

BEFORE: HOME | PRODUKTE | ÜBER UNS | KONTAKT | Search Icon
AFTER: HOME | PRODUKTE | ÜBER UNS | KONTAKT Search Icon

[David]

Hi there,

change your CSS to this:

.main-nav > ul.menu > li.menu-item:not(:last-child) > a::after {
    content: "";
    width: 100%;
    height: 20px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    border-right: 1px solid #DEC095;
    z-index: 9999;
}

[kernfunke]

Hi David,
excellent! It worked! Thanks a lot!

[David]

Glad to hear that

[Author]

Posts