[julianno]

I need a help to have a CSS rule to change all menu and submenu items to have rounded corners (also hover items ones).

Thanks!

[Sakin]

@julianno: It’s bit difficult one. Please consider hiring customizer at http://bit.ly/catch-tweaky

[julianno]

Ok, dou you have at least the name of all menu elements so I can try a custom CSS?

– The menu hover item;
– All current menu item;
– The selected menu Item – completed (have code below)

#header-menu .menu .current-menu-item > a, #header-menu .menu .current-menu-ancestor > a, #header-menu .menu .current_page_item > a, #header-menu .menu .current_page_ancestor > a, #colophon .menu .current-menu-item a {
/* Safari 3-4, iOS 1-3.2, Android 1.6- */
-webkit-border-radius: 12px;
/* Firefox 1-3.6 */
-moz-border-radius: 12px;
/* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
border-radius: 12px;
}

Thanks

[Sakin]

@julianno: Can you let me know what are you trying to do it and then send me your site URL. Then I will check in the css. Also you can check your theme style.css menu section.

[rbrt_bene]

Hy,

I managed to make rounded corners on menu items and submenu items with the following CSS:

#header-menu .menu .menu-item > a, #header-menu .menu .menu-ancestor > a, #header-menu .menu .page_item > a, #header-menu .menu .page_ancestor > a, #colophon .menu .menu-item a {
/* Safari 3-4, iOS 1-3.2, Android 1.6- */
-webkit-border-radius: 12px;
/* Firefox 1-3.6 */
-moz-border-radius: 12px;
/* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
border-radius: 12px;
}

However I have a thin line around the submenu box. Is there any CSS to remove that?
Is there any CSS code to make rounded corners for the menu background color?

Regards,

Robert

[Author]

Posts