[Thorsten Hoeppner]

I would like to round off the top corners of the current menu item in the main menu, like on an index card.

Unfortunately, I can’t find the right entry in the CSS.de I can’t find the right entry in the CSS.

[tikaram]

@hoeppner1867 : Please post in your site URL so that I can check and provide you the required additional css.

Regards,
Tikaram

[Thorsten Hoeppner]

https://welliathome.de/

[tikaram]

@hoeppner1867 : Login to your WordPress admin section.
Go to Appearance => Customize => Additional css and add the following css

.nav-primary ul.menu .current-menu-item > a {
    border-radius: 10px !important;
}

Let me know if this helps you out.

Regards,
Tikaram

[Thorsten Hoeppner]

Thanks, but only the home button has rounded corners.

[Thorsten Hoeppner]

Thanks, ist works. Only the hover buttons are not rounded.

[Thorsten Hoeppner]

I added that, but I can’t find the hover buttons.

.nav-primary { padding-top: 5px; }

.nav-primary ul.menu .current-menu-item > a {
border-radius: 12px 12px 0px 0px;
background-color: #ffffff !important;
}

[tikaram]

@hoeppner1867 : Please discard the previous additional css and add the following css

.catchresponsive-nav-menu a {
    border-radius: 12px 12px 0 0;
}

Let me know if this works as expected or not.

Regards,
Tikaram

[Thorsten Hoeppner]

Thank you, but now all submenu items are also rounded off. 😉

[Sakin]

Hi Thorsten,

So, after that CSS if the Sub-menu is also rounded off and want to remove rounded for sub-menu then you can add additional CSS as:

.catchresponsive-nav-menu .sub-menu a {
	border-radius: 0;
}

Regards,
Sakin

[Thorsten Hoeppner]

Great, now it works exactly as I imagined. 🙂

 

[Author]

Posts