Where to copy/paste this code?
The simplest way is to use the Custom CSS section of the customizer option screen. If you have many customizations to make in CSS and PHP, then we strongly recommend you create a child theme. Everything you need to know about creating a child theme with Customizr here.
Remove the Grey Bar:
/* START OF Change Grey Bar between Navbar and Slider */
header.tc-header {
border-bottom: 0;
}
/* END OF Change Grey Bar between Navbar and Slider */
Credit: @fabioeliseo
Change the Grey Bar:
/* START OF Change Grey Bar between Navbar and Slider */
/* 2px=thickness, solid=style (dotted - dashed - solid - double - groove - ridge - inset - outset), green=color */
header.tc-header {
border-bottom: 2px solid green;
}
/* END OF Change Grey Bar between Navbar and Slider */
Change the Grey Bar on specific pages:
/* START OF Change Grey Bar between Navbar and Slider */
/* Front Page */
.home header.tc-header {
border-bottom: 2px solid green;
}
/* Posts Page */
.blog header.tc-header {
border-bottom: 2px solid green;
}
/* Other Page */
.page header.tc-header {
border-bottom: 2px solid green;
}
/* Specific Page (change page-id-n) */
.page-id-n header.tc-header {
border-bottom: 2px solid green;
}
/* END OF Change Grey Bar between Navbar and Slider */
22 thoughts on “Change Grey Bar between Navbar and Slider”
Is there a snippet code to change the color of the bottom bar just above the widget area? I have been unsuccessful in finding any. Thank you
Hi,
I was wondering is there a way to modify tc-header” ‘s color as gradient.
I simply need to apply class=”lang:css”> height: 200px;
background: -webkit-linear-gradient(left, #0479b5, #78be20); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(right, #0479b5, #78be20); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(right, #0479b5, #78be20); /* For Firefox 3.6 to 15 */
background: linear-gradient(to right, #0479b5, #78be20); /* Standard syntax (must be last) */
}
Whatever I have tried couldn’t make it, it wraps all the navbar area but the top border.
Many Thanks in advance
M.
Hi,
first thank you for your time and your help,
I trying to move the menu into the grey bar between navbar and slide, you can tell me please how to do it.
my website is: magnet4event.com
Hello Dave,
First of all your site is fantastic and thank you for taking the time to put this together. I apologize if I am simply missing this from another post on the site but I was able to successfully remove the grey bar beneath my navbar but I would also like to eliminate the white bar right below my page titles on all the pages. Thanx in advance and again if I missed this elsewhere I apologize.
Mmm, one I missed by the look of it!
Easy to fix:
.featurette-divider {display: none;
}
how can i do to show all the slide image to top ? Thank´s for your help
Hi Felipe. I’d suggest the Forum would be a better place to get a solution for this, with a much wider audience to help fix problems. And please include a link to your Site.
Hello, i have a question.
First of all, my site is http://www.ruksanna.nl
Im trying to change to colour of my grey bar which i managed to do.
But now i have another issue, as you can see i made my bar red. On the left and right of the page there is a border also (to the left of my logo and on the other side)
how can i remove these lines, i would like to let the horizontal line as it is but change the side border to a white color so it wont be visual.
I hope someone can help me do this.
Hi dogg gy, you seem to have fix your styling issues. Looks great!
When I try entering this code in the child theme stylesheet it does not change, however if i enter it on the custom CSS from the customiz’it tab it works fine – am I doing something wrong in terms of adding code to the child theme? Thanks
Hi Daniel, you are not doing anything wrong, this should work fine!
Hi! I am wondering how do you remove the spacing between the tagline and the slider? There’s a huge gap in between as a result of removing the menu/header box. Thanks in advance!!
Sorry for delay in replying.
Your topic is related to the theme general styling, can you please post this thread in the theme users forum : Forum.
Include a link to your site so we can see exactly what you mean.
Thanks and we’ll do our best to help.
Is it possible to replace the grey bar by a picture? Greetings
Sorry for the delay in responding. Did you resolve this?
I’m not sure what sort of picture could replace the grey bar – what dimension were you thinking of? Won’t it look odd with the Slider following it?
Hello, I am looking to do the same thing. I want to put a 5-10px diamond plate border on top of the slider. Thanks.
Hello, does the possibility exist to let indicate the respective side title and contribution title in the grey bar? Many thanks and greetings from Berlin | Germany…
Hi! Is it also possible to remove the bar on all pages, except for the ‘main’ page?
I’ve updated the Snippet. To do what you want, you need to Remove All Grey Bars & then set color of the .home item.
Thanks a lot!
And how can change the color of this bar? Greetings
Err, if you look at the 2nd example, I think ‘green’ might be a clue? 😉
Forgive my British sense of humour. I did make a quick change after this Snippet was published to include the 2nd item, so it’s possible you didn’t see it when you posted.
Hope you’ve managed to sort it.