Jump to content

How to adjust header menu picture for desktop and mobile?

Recommended Posts


I'm using a custom header for my homepage to display a scrollable gallery underneath the header/navbar, it works great but the problem is certain pictures look good on mobile but not desktop, or vice-versa. For example this one:



As you can see it doesn't work for desktop since it hides the name/menu. I just need to adjust the height/position of it so the white sky is the background for the black text. I have a lot of pictures like this, is there some way to lock the position in place where I need it? I can't find any options in the gallery settings that let me do this.

Here's the code I'm using for the header as well:

body.homepage article section:first-child {
    padding-top: 0px !important;

Thanks for any help! Really appreciate it.

Link to comment
  • Replies 1
  • Views 995
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

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.