Hi there! I am wanting to change the background colour of the strip behind the navigation/menu bar to #FF79A4. I would then also like to change the font colour of the navigation to white. I would still like to keep the rest of the header background white, it is just the horizontal bar that goes b…

@vmckellar - can you please share your website link?

Hi @suyash1 , Yeah sure, it’s https://www.daisyandwillow.com.au/ Thanks!

@vmckellar - your header is in grid format and hence menu does not go full width horizontally and that is why it will not be a complete strip, so it needs css editing, please check screenshots, it changes alignments a bit [suyash1_0-1675493307432.png]

@vmckellar - please add given css to the very end of your base.css file and check .header__inline-menu{background-color: #FF79A4; width: 100%; text-align: center;} .header__search{padding-left: 5rem;} .header__icons{padding-right: 5rem;} [suyash1_2-1675493601719.png]

@suyash1 thank you! It’s not running across the entire screen at the moment, only the page width: [Screen Shot 2023-02-04 at 5.58.50 pm.png]

@vmckellar - add this css too @media screen and (min-width: 990px){ .header {padding: 0 !important;} }

@suyash1 Ok that made it slightly wider, but not full screen: [Screen Shot 2023-02-04 at 6.07.02 pm.png]

@vmckellar - add this too .header{max-width: 100%;}

@suyash1 OK perfect! :blush: Now, how to change the font colour to white and add just a little bid of padding above the logo? Thank you!

@vmckellar - I do not recommend white as your drop down background is also white, it will not be visible [suyash1_0-1675494959122.png]

Change Nav Bar background & font colour - Colorblock Theme

Store Design

suyash1 February 6, 2023, 2:28am 20

@vmckellar - great, do let me know if you need any other update, you can message here or you have my email below

Topic		Replies	Views
Nav bar header design Store Design design , header	28	294	January 23, 2025
Change Drop Down Menu Background Colour On Boost Theme Store Design shopify-themes	7	79	January 12, 2023
Change logo, menu text, icons, and drop down menu color in the debut theme Store Design	18	186	August 11, 2023
Change nav font, size and colours (debut theme) Store Design	5	63	July 22, 2021
Need to Know how to change the colour of Nav bar Store Design	8	100	August 24, 2020

Change Nav Bar background & font colour - Colorblock Theme

Related topics