[Support request] Menu item – hover radius (rounded)

[Nele]

Dear,

I want a menu item (main menu) that looks like a button with rounded worners.

I found this on some of your earlier support topics as custom css:

.main-navigation {
border-radius: 5px;
}

This does the trick 🙂 but when I over over it, the corners are sharp again…Does anyone know how I can fix this?

kind regards
Nele

[Leo]

Hi there,

Is it just a single menu item that you are looking for?

If so follow the steps here:
https://docs.generatepress.com/article/adding-buttons-navigation/

Then modify your CSS to this:

@media (min-width:769px) {
    .main-navigation .main-nav ul li.nav-button a {
        background-color: #ffffff;
        border: 2px solid #000000;
        color: #000000;
        line-height: 35px; /*this number will likely need to be adjusted*/
        border-radius: 5px;
    }
}

If this doesn’t help, any chance you can unlock maintenance mode so we can see the issue?

Let me know 🙂

[Author]

Posts