Jump to content

Code to resize banners for mobile?

Recommended Posts

  • Replies 6
  • Created
  • Last Reply

Oh, the background photos.  That's a common complaint I get from my customers.

There's no real way that I have found to fix that, if you have content on top of it.

If its blank, you can shrink the height so you can keep the aspect ratio similar to a desktop.

Link to comment
11 minutes ago, rwp said:

Oh, the background photos.  That's a common complaint I get from my customers.

There's no real way that I have found to fix that, if you have content on top of it.

If its blank, you can shrink the height so you can keep the aspect ratio similar to a desktop.

What about just the home page since there is technically nothing on top of that? Or changing the image completely only for mobile?

Link to comment
@media screen and (max-width: 999px) {
	[data-section-id="5ee4228213797867355e78b9"] {
    	height: 75vh !important;
    	min-height: 10vh !important;
	}
}

@media screen and (max-width: 699px) {
	[data-section-id="5ee4228213797867355e78b9"] {
    	height: 50vh !important;
    	min-height: 10vh !important;
	}
}

@media screen and (max-width: 399px) {
	[data-section-id="5ee4228213797867355e78b9"] {
		height: 40vh !important;
		min-height: 10vh !important;
	}
}

Give that a try for the home page

Link to comment

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.