Jump to content

Vandam Background Image Issues

Recommended Posts

Hello. I am having one heck of time figuring out what exactly is going wrong with my site. I have chosen the Vandam template because in the site demo it does the exact thing I want to do, as you resize the browser window at a certain point the image stops scaling and the window simply crops the image.

This also happens in the mobile views of the demo site. The new aspect ratio simply crops the background image to accommodate the new screen size. SIMPLE.

For some reason on my site it is insisting on keeping the background image in the exact proportions, and not doing any of the expected cropping / scale limitations in the responsiveness of the site. It is driving me literally nuts. I have tried looking at custom CSS for this but it seems silly, since this is literally exactly what this template supposedly does.

here is a link to my site, maybe someone has an easy fix for this? I did put custom CSS in this to try to solve for at the very least the desktop which works but again at certain point the image just starts shrinking, holding to a fixed aspect ration, no cropping causing a big old white space.

I also have 9x16 image that I can use for mobile but I don't see any option to have a mobile specific background image. I have seen CSS to make this happen but again it did not work the way I expected. 

Thank you in advance!

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

Top Posters In This Topic

Popular Days

Top Posters In This Topic

On 3/2/2023 at 6:30 AM, kelmil125 said:

Hello. I am having one heck of time figuring out what exactly is going wrong with my site. I have chosen the Vandam template because in the site demo it does the exact thing I want to do, as you resize the browser window at a certain point the image stops scaling and the window simply crops the image.

This also happens in the mobile views of the demo site. The new aspect ratio simply crops the background image to accommodate the new screen size. SIMPLE.

For some reason on my site it is insisting on keeping the background image in the exact proportions, and not doing any of the expected cropping / scale limitations in the responsiveness of the site. It is driving me literally nuts. I have tried looking at custom CSS for this but it seems silly, since this is literally exactly what this template supposedly does.

here is a link to my site, maybe someone has an easy fix for this? I did put custom CSS in this to try to solve for at the very least the desktop which works but again at certain point the image just starts shrinking, holding to a fixed aspect ration, no cropping causing a big old white space.

I also have 9x16 image that I can use for mobile but I don't see any option to have a mobile specific background image. I have seen CSS to make this happen but again it did not work the way I expected. 

Thank you in advance!

You can consider adding 2 sections, then we can give code to show section 2 on mobile only

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.