Jump to content

How to change height + centring of text over images on mobile view?

Recommended Posts

Maybe this is a two part question:

1. I'm trying to figure out how to change the height of my index banners on mobile view (I've tried several things that don't work).

2. When I change the height of image (and probably the index banners too) the text over the images stops being vertically centred over the images. Is there an easy way to solve this with CSS? or even an example of how to do it with one image so I'll duplicate it for the others.

Thank you in advance for your help!

The site url is https://lily-smilodon-gzzc.squarespace.com/
And it's currently getting linked to http://www.moveintowellbeing.co.nz/ (private until finished pw: temporary)


Link to comment
  • Replies 2
  • Created
  • Last Reply

@JacquiNZ Add to Home > Design > Custom CSS

@media screen and (max-width:640px) {
figure img {
    width: 100% !important;
    height: auto !important;
    top: 0 !important;
    left: 0 !important;
figure.Index-page-image.loaded {
    top: 0 !important;
.Parallax-item {
    top: 0 !important;


Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.