Archived topic

Creating a radius on main nav

3 replies · Started by Louis on May 24, 2018

Viewing posts 1–4 of 4

May 24, 2018 at 12:33 pm #583872

Hi,

Modifying the Catalyst site. I put a background color on the main nav in the header and would like to create a radius to make the menu items appear as rounded rectangle buttons. Perhaps add a border as well.

I've been using the Web Developer tools in firefox and the source and looking for clues in all the css files, but, no matter what class or id I try to get the result, they all fail.

Thanks for any assistance.

Lou

May 24, 2018 at 2:37 pm #583963

Hi Louis,

first of you need to go to the Customiser > Colors > Primary Navigation and set the primary menu and sub menu backgrounds to transparent.

Then use this CSS:

.main-navigation .main-nav ul li a {
    background-color:  rgba(3,66,78,0.82);
    border-radius: 10px;
    margin: 5px;
}

May 25, 2018 at 5:42 pm #584806

Thanks David. Perfect.

Enjoy your weekend.

Lou

May 28, 2018 at 10:15 am #586437

You're welcome Louis

This archived topic is closed to new replies.

Start building better websites today.