[Resolved] Change background color nav button

Log In Free Support

Popular Articles

Missing style.css

Updating errors

Installing GP Premium

Installing GeneratePress

This topic has 3 replies, 2 voices, and was last updated 4 years, 1 month ago by David.

Viewing 4 posts - 1 through 4 (of 4 total)

Author

Posts
February 8, 2022 at 3:50 am #2109234

Renske

Hi there,

I want to style my nav button.

Currently, the non-hover text is white and the border is white, but the text is green. I want the text to be white, too.
And I want a hover effect: green background, green border and white text.

what CSS do I need to accomplish this?

Thanks!

February 8, 2022 at 4:38 am #2109286
David
Staff
Customer Support
Hi there,

try swapping your CSS for this:
```
.main-navigation .main-nav ul li.nav-button a {
    border: 2px solid #fff;
    color: #fff !important;
    line-height: 35px;
}
.main-navigation .main-nav ul li.nav-button:hover a {
    border: 2px solid #78c16c;
    background-color: #78c16c !important;
    line-height: 35px;
}
```
February 8, 2022 at 4:40 am #2109289

Renske

Excellent! Thank you, sir! 🙂

February 8, 2022 at 4:40 am #2109291

David
Staff
Customer Support

You’re welcome!
Author

Posts

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.