Jump to content

Mobile Image resize - IDUMA

Recommended Posts

Site URL: https://bison-buttercup-bdpb.squarespace.com/

IDUMA template: 


https://bison-buttercup-bdpb.squarespace.com/ Password: 12345

(1) How to get the first image to display full width on mobile device?

I tried the following code but it leaves a grey background on mobile. 

@media screen and (max-width:640px) {
[data-section-id="5f249752d6f33d72e0925409"] .section-background img {
    width: 100% !important;
    height: auto !important;


(2) How to get the last image - height large on desktop but small on mobile?


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

Q1. Q2. Remove your code & add this code

@media screen and (max-width:767px) {
/* homepage first banner */
.homepage #page section:nth-child(2) {
    min-height: 20vh !important;
    height: 30vh !important;
/* last image */
[data-section-id="5f249752d6f33d72e092540f"] {
    min-height: 20vh !important;
    height: 30vh !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


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.