Archived topic
border last menu element
3 replies · Started by jal-mj on May 26, 2021
Hi,
I would like to put a border to the last element in the menu like this: https://www.screencast.com/t/4i7Rn2fayqc
How can I do it?
Thank you very much.
Hi there,
1. Add this CSS to your site:
.main-navigation:not(.slideout-navigation) .main-nav li.nav-button a {
color: rgba(72,45,112,1.0);
border: 3px;
border-style: solid;
line-height: 36px;
border-radius: 2px;
margin-left: 20px;
transition: all 0.6s ease 0s;
}
.main-navigation:not(.slideout-navigation) .main-nav li.nav-button a:hover {
color: rgba(72,45,112,0.8);
}
2. edit your menu, select the menu item you want the border on and give it a CSS Class of: nav-button
This doc explains how to add classes to menu items:
https://docs.generatepress.com/article/using-the-wordpress-menu-builder/#custom-classes
David! Thank you very much!
You're welcome