Jump to content

How to get a banner image UNDER the menu, not overlayed

Recommended Posts

Hi,

 

I'm desperately trying to have a full-bleed image right below my menu. It seems that when I use a banner image it automatically sets it as an overlay with the menu. If I use a spacer, its too much space between the menu and the image. How can I make the image below the menu without using a spacer?

Attached are images. I'd like the the image to appear under, like the second, but without such a large space between the menu and the image.

Screen Shot 2021-02-04 at 4.27.02 PM.png

Screen Shot 2021-02-04 at 4.33.40 PM.png

Link to comment
  • Replies 5
  • Views 980
  • Created
  • Last Reply

One of my clients used this approach to solve the above problem.

You can add a blank section  above current section, then add this code to Design > Custom CSS to adjust its height.

/* home first section height */
body.homepage #page section:first-child {
	min-height: unset !important;
	height: 10px !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
20 hours ago, tuanphan said:

One of my clients used this approach to solve the above problem.

You can add a blank section  above current section, then add this code to Design > Custom CSS to adjust its height.


/* home first section height */
body.homepage #page section:first-child {
	min-height: unset !important;
	height: 10px !important;
}

 

That's perfect! Thank you so much!

Link to comment
  • 1 month later...

Archived

This topic is now archived and is closed to further replies.

×
×
  • 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.