Jump to content

Customizing banner image size

Recommended Posts



Just wanted to know if there is a way to customise the banner size on my site depending on how large the window is and also if possible to customise for the mobile view too?

I have a video/show reel type thing playing in the banner and when the window isn't full screen or is in mobile view it only shows the middle of it which cuts out a lot of the faces in the shots.


Basically, is there a way to make sure the video is always formatted the same size on all platforms and screen sizes?

I don't think I explained that very well, but hopefully that makes sense?


Thank you in advance!


Anyways, here's what I mean from my site:


This is the main site page when it's full screen1133154643_Screenshot2021-03-23at11_29_33.thumb.png.14b0a61d80d0af0aac2e1c0358eb5bfa.png


This is with a narrower screen (there's a head missing on the right as you can see)



Then this is mobile view, and it's clearly not got the full image


Link to comment
  • Replies 4
  • Views 478
  • Created
  • Last Reply
On 3/26/2021 at 7:42 PM, ktbxter said:

site is


password: website


thank you!

Try adding this to Design > Custom CSS(code for Cinemaphotography page)

/* resize mobile video cinemaphotography */
@media screen and (max-width:767px) {
[data-section-id="604b7448a8a00249612af754"] {
    min-height: unset !important;
    height: 30vh;
[data-section-id="604b7448a8a00249612af754"] iframe {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
    top: 0 !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.