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
  • Views 142
  • Created
  • Last Reply

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

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment


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.