Archived topic
Customizing Secondary menu.
3 replies · Started by Jusung on February 15, 2023
Viewing posts 1–4 of 4
Hello.
When you see the first link, you can see the primary menu that has border between menu items and backgroudn hover that is fully stretched.
I want to make the same thig on the secondary menu on the second link.
On the second link, I have 5 menu items on secondary menu, but 2 of them are hidden depending on the login status.
I tried to copy the code changing main-nav to secondary-navigation, but it didn't work.
Hi Jusung,
Go to Appearance > Customize > Layout > Header and remove the top and bottom padding.
Then, try this:
.secondary-navigation .main-nav > ul > li a {
line-height: 60px;
}
.secondary-navigation .main-nav > ul > li:hover a {
background: #a593e0 !important;
color: #f8f8ff;
}
.secondary-navigation {
height: 100%;
}
.secondary-navigation .main-nav > ul > li:not(:first-child):after {
content: "";
height: 50px;
width: 0.7px;
background-color: #000;
position: absolute;
top: 50%;
transform:translateY(-50%);
}Thank you! it works well!!
You're welcome, Jusung!
This archived topic is closed to new replies.