Jump to content

Looking for custom code to make transparent hear go to white when fixed

Recommended Posts

I have a transparent header. I added the code:

.Header {
position: fixed !important; 
z-index: 1000;
width: 100%;

to make it fixed. I'd like only the fixed header to have a white background. Is there code I can add to achieve this? I added background: white, but it changed my transparent header to white - only want the sticky header white.

Link to comment
  • Replies 1
  • Views 1.1k
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

What is your site url? We can check easier

If SS 7.1, you can enable fixed header by use this option


then use this CSS code to change sticky header background color

header#header.shrink {
	background-color: white !important;


Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.