I highlighted two menu items. One orange and the other green. I wish they looked like buttons. But the height is too high. I would like to lower the height.
The website can be seen here.
https://www.successionetelematica.com/
I used this code
.highlighted {
background color: #ff7514;
border-radius: 5px;
}
.highlight at, .highlight at:hover, .highlight at:focus {
color: #ffffff !important;
font-weight: bold;
}
.menu_main_nav>li>a {
padding: 6px 5px 6px;
font-size: 0.929em;
font weight: 500;
line height: 1.28em;
}
.highlighted2 {
background color: #008f39;
border-radius: 5px;
}
.highlight2 a, .highlight2 a:hover, .highlight2 a:focus {
color: #ffffff !important;
font-weight: bold;
}
.menu_main_nav>li>a {
padding: 6px 5px 6px;
font-size: 0.929em;
font weight: 500;
line height: 1.28em;
}
How can I lower the height?
Thank you
Hey,
Thanks for contacting us!
Please change following codes
.evidenziato {
background-color: #ff7514;
}
.evidenziato2 {
background-color: #008f39;
border-radius: 5px;
}
to following ones
.evidenziato .avia-menu-text {
background-color: #ff7514;
border-radius: 5px;
padding: 10px;
}
.evidenziato2 .avia-menu-text {
background-color: #008f39;
border-radius: 5px;
padding: 10px;
}
Best regards,
Yigit
thank you! Optimal :-)
Pino Caddeo
Hi,
You are welcome! :)
For your information, you can take a look at Enfold documentation here – https://kriesi.at/documentation/enfold/
If you have any other questions or issues, feel free to start a new thread under Enfold sub forum and we will gladly try to help you :)
Enjoy the rest of your day!
Best regards,
Yigit