Jump to content

How do I reduce the banner size to fit Mobile setting? (custom CSS)

Recommended Posts

Site URL: https://singswithtrees.com/divination

Hi!

I'm looking for some help with custom CSS to reduce my banner image in the mobile setting. I'm using the Greenwich template. 

I need to adjust the sizes of the banners on all pages, but this page is my current priority:

https://singswithtrees.com/divination

 

along with the home page:

www.singswithtrees.com 

 

Any help would be much appreciated! Thank you! 

 

-Aislinn 

 

Link to comment
  • Replies 6
  • Created
  • Last Reply

Top Posters In This Topic

On 4/30/2021 at 7:22 AM, AislinnBrooke said:

Yes, Tuanphan, those are the ones! 🙂

Add to Design > Custom CSS > Then save & reload your site. If it works, I will check home banner.

/* resize mobile banners */
@media screen and (max-width:640px) {
body#collection-6085d47a2dc9ea4e2f928436, body.homepage {
.Parallax-item:first-child img {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
    top: 0 !important;
}
.Parallax-item:first-child figure {
    transform: unset !important;
}
section.Intro.Intro--has-image {
    min-height: unset !important;
    height: 200px !important;
}}
section#new-page {
    min-height: unset !important;
    height: 250px;
}
}

 

Edited by tuanphan

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
On 5/1/2021 at 3:13 PM, AislinnBrooke said:

Hello Tuan, 

Yes,  it works beautifully! Thank you!

Can you help with the code for the homepage?:

www.singswithtrees.com 

 

 

 

Screen Shot 2021-05-01 at 12.56.52 AM.png

 

On 5/1/2021 at 3:13 PM, AislinnBrooke said:

Hello Tuan, 

Yes,  it works beautifully! Thank you!

Can you help with the code for the homepage?:

www.singswithtrees.com 

Updated above code. Try add it again & reload your site

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.