Jump to content

Resizing Banner Image on Mobile?

Recommended Posts

Site URL: http://www.vidadoulas.ca

Hey There, 

Website images look great on desktop, but when viewed on mobile, they are cropped in so you can't see the whole image when looking at the banners. I had a look at the forum and tried some custom code, but doesn't seem to work on our site. 


I would love any help to get it so the whole image can be viewed on the home page, but also our services pages as well. 


Thanks so much! 




Screen Shot 2020-11-13 at 3.25.03 PM.png

Link to comment
  • Replies 1
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

Add to Home > Design > Custom CSS

/* resize mobile image */
@media screen and (max-width:640px) {
.homepage #parallax-images>div:first-child img {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
.homepage #parallax-images>div:first-child {
    transform: unset !important;
    top: 100px;
.homepage #content-wrapper>div:nth-child(3) {
    height: 250px;


Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.