Best Premium and Free WordPress Themes › Forums › Click › Background colour of sticky header
Tagged: color, hover, menu, Navigation
- This topic has 8 replies, 3 voices, and was last updated 4 years, 2 months ago by
Maidmarion.
-
AuthorPosts
-
November 23, 2017 at 9:49 am #22178
eurodolphin
ParticipantI am planning to use this theme for the website of an amateur photographer. Can you tell me where I can find the CSS that controls the background colour of the sticky header?
November 23, 2017 at 10:56 am #22181acmethemes
KeymasterHello eurodolphin,
Thank you so much for your interest in our theme. You can find css codes insidestyle.css
file of theme root folder. Please check it.Regards
November 23, 2017 at 3:30 pm #22201eurodolphin
ParticipantThank you very much for replying so quickly. Before raising my question I had spent a lot of time looking for the CSS that determines this colour. I notice that it’s the same colour as the menu drop-downs. I found it in two CSS files: metabox.css (line 43: border: 3px solid #F88C00;) and style.css (line 3975: border-top: 18px solid #f88c00;). Neither of these is a background colour and removing both lines has no effect on my test website: http://www.eurodolphin.com/rb2/ So I’m hoping you can give me a slightly stronger clue as to where I might look. Many thanks in advance.
November 24, 2017 at 2:41 am #22230acmethemes
KeymasterDear
Please add the below CSS codes on Appearance > Customize > Additonal CSS,.site-header.fixed { background: red !important; }
Hope this help. Please change the color name as your need. If you don’t need any color, just make it
none
Thank you
November 24, 2017 at 9:03 am #22236eurodolphin
ParticipantMany thanks again. I wanted to retain the transparency of the header because a solid one obscures part of the image. By looking at all the ‘site-header’ lines in style.css I found this on line 1895: ‘background: rgba(247, 142, 63, 0.3);’ The problem with this is that any colour is going to clash with some of the images. The answer, as I see it, is to make the header background grey. I have done this by changing to: background: ‘rgba(153, 153, 153, 0.3);’
November 26, 2017 at 3:22 am #22321acmethemes
KeymasterThank you
October 28, 2019 at 11:35 pm #71959Maidmarion
ParticipantI wonder if I can continue this thread a little.
I have successfully added custom CSS to change the background color for the menu site-wide to an olive green color and retained the transparency. The menu text color is the default white which I want to retain. I have also managed to change the text color on hover ON THE HOME PAGE to #663300 (a shade of brown) and also the “currently selected” page to the same shade of brown. The code I used is this:
.main-navigation .current_page_item > a,
.main-navigation a:hover {
color: #663300!important;
}
HOWEVER, on all other pages/categories other than the Home page, the menu items become black on hover. Whilst this might be considered a subtle difference (black compared to brown) it’s driving me mad that I can’t fathom out the CSS to make the black become brown! It’s only the color on hover that I want to change. Can you help me with the correct CSS please?
Thanks very much.October 31, 2019 at 11:49 am #72056acmethemes
KeymasterDear Maidmarion,
If you can provide us your site URL, we will observe and can provide you with possible solutions.
Best Regards!November 1, 2019 at 11:33 am #72099Maidmarion
ParticipantI’m so sorry, I was sure I’d let you know that I’d solved this. Maybe I wasn’t logged in at the time. Anyway, the problem was essentially that I didn’t know how to use the Inspector in chrome properly to show my the hover code. Once I found out how to do that, I was able to edit the CSS. For the benefit of anyone else having the same problem, the code I used was:
.not-front-page .header-wrapper .menu li a:hover {
color: #663300 !important;
}Thanks for responding anyway. The site in question is still under development so I couln’t provide you with the URL.
-
AuthorPosts
- The topic ‘Background colour of sticky header’ is closed to new replies.