Jump to content

How to keep image in section 1 from going into header?

Recommended Posts


I know it is standard for the background image from section 1 to also become background for the header. But I don’t want this. How can I keep the header background white, while having a background image in section 1? 

Thank you


Edited by RZTree
Link to comment
  • RZTree changed the title to How to keep image in section 1 from going into header?
  • Replies 4
  • Views 767
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

If you select the solid header and you won't see the background under the header.   Edit Site Header / Style and select Solid.    Or am I missing something that you are trying to do?

You can also adjust the section background image and move it with the margin-top: xvh or x%.  

Edited by Donna_Vincent
Link to comment

Please see the following.

The main issue is that SS treats the first section on a page specially by dynamically adjusting the top padding of the section. This makes it difficult to manipulate padding and margins.

My code hides the first section while still allowing SS to manipulate that top padding dynamically.

Let us know how it goes.

Edited by creedon

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
On 6/4/2022 at 6:43 AM, RZTree said:

Hi Donna,

the thing is - I don’t want a solid background for section 1. I want an image for section 1. 

can you explain more about moving it with a margin?

thank you so much

Section 1 would have your image background. There are 4 different settings for the Header under Edit Site Header and Settings.  One may accomplish what you want to do without code.

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.