Change top menu text color

Hello,

I would like to change the top menu bar text color. I used the below custom CSS, which changes the font but has no effect on the theme default text color, which is white. Would appreciate your help, thanks!

#header .top-header .header-navigation ul li {
margin-left: 40px;
line-height: 40px;
font-weight: 500;
font-size: 16px;
color: #f0a6ab;
position: relative;
float: left;
font-family: ‘Cormorant Unicase’, serif;
text-transform: none;
letter-spacing: 1pt;
}

hey there

Hope you are having a good day and thank you for your question
Please add this CSS in appearance - customize - additional CSS

#header .top-header {
background: black;
}

Thanks!
Colorlib Support Team

Hello,

Thanks for your reply. I figured out how to change the navigation bar font color, but out of curiosity - why change the header bar background to black? Does this piece of code somehow affect the font color too? I only really know a bit of css so the workings of how various codes link up is a mystery to me haha.

Thanks again :slight_smile:

hey there

“but out of curiosity – why change the header bar background to black?” - Well, this is only example :slight_smile: its more easy to understand for our customers where we used black color and what was changed, you can use any other color instead of black, just an example :slight_smile:
is there anything else?

Ah thanks :slight_smile: Yes I have another question. Upon checking my website on a bigger screen, I realised the feature images are cut off. Below is the css I used, with the height at 600px my feature images fitted the laptop screen, but of course setting a fixed height is very limited.

As the feature image seems to be a background image, just setting the background-size to 100% doesn’t seem to work when the feature image area has no content.

Is there a way to set the feature image height so it automatically shows the full height of the image on any screen size?

#header .bottom-header {
padding: 0;
height: 600px;
margin-bottom: 0;
}

Thanks!

Hi there,
Thanks for reaching out.
In relation to your question here, could you perhaps try installing this plugin (Regenerate Thumbnails – WordPress plugin | WordPress.org) and regenerate your images. Once this is done, check whether there are improvements in the display.

I hope this helps.
Best Regards,
Support.