Jump to content

Resizing images and many galleries for mobile

By jolenem, in Customize with code

Go to solution Solved by tuanphan,

Recommended Posts

jolenem Level 4

jolenem

Posted
Posted (edited)

Site URL: https://www.dubbe-moulder.com/

Hello everyone,

  1. On the architecture firm’s website https://www.dubbe-moulder.com there are many galleries for projects and I’d like to resize them all for mobile as they are currently cropped.
  2. Also, there is a still image of the architects on the home page, cropped as well, how do I resize it?
  3. Finally, on the contact page, there is divider as an image that's supposed to separate the form block from the contact info. On the mobile site it is oversized, dropping the contact info to the very bottom. Is there a way to resize it to very small, or drop it after the contact info?

See the 2 images below. Thank you in advance.

gallery-example.jpg

image-architects.jpg

Edited by jolenem
modif
Link to comment
  • Replies 2
  • Views 201
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Posted Images

  • Solution
tuanphan Level 18

tuanphan

Posted
  • Solution
Posted

#1. #2. Add to Design > Custom CSS 

/* resize gallery mobile */
@media screen and (max-width:767px) {
.gallery-fullscreen-slideshow {
    height: 35vh !important;
}
[data-section-id="5f4014bbdc61a56e39da1305"] {
    min-height: unset !important;
}
}

#3. If you want to remove it on mobile only, add this CSS 

/* contact page - remove line */
@media screen and (max-width:767px) {
div#block-yui_3_17_2_1_1597937014007_7766 {
    display: none;
}
}

 

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

Sign Up / Login
Go to topic listing

News

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Upcoming Webinars →

Hire a Designer

Stand out online with the help of an experienced designer or developer.

Get Matched →

Support

Community

Developers

Resources