Docs

[jwsoutha]

Hello,

I am working on a site for a client (currently in development at http://hyback.com/cent/bside/wp/dev/).

The client has asked to add straight pipe characters between the navigation menu items, which I have done previously on other sites with li+li css content technique. I’ve tried it on this site, but the resulting character becomes part of the menu item link. Is there a way to do this with X using the Renew stack where the separator characters are non-clickable?

Current code:

.x-navbar .desktop .x-nav>li+li>::before {
  content: "|";
  padding: 0 .5em;
}

Thanks!

[Thai]

Hi There,

Please remove your custom CSS and add the following CSS instead:

.x-navbar .desktop .x-nav>li:after {
    content: "|";
    position: absolute;
    color: #fff;
    right: -2px;
    top: -7px;
}
.x-navbar .desktop .x-nav>li:last-child:after {
    content: "";
}

Hope it helps 🙂

[jwsoutha]

Works. THank you!

[Thai]

If you need anything else please let us know.

[Author]

Posts