Jump to content

Banner displaying differently on some mobile pages

Recommended Posts

Site URL: https://d4ad-nchems.squarespace.com/config/

Site password is D4ADLessons

I have 6 main pages on the site--landing plus 5 pages off of the main navigation.  I swear I have built them all exactly the same, but they do not all display the same on mobile (I am fine with how they look on the desktop).  The Resources page looks like I would like it to.  I have attached what it looks like on desktop and mobile.  However, the other pages only show two of the pics in the banner and have extra space around the text.  I have also attached examples of that.

I don't know why the extra space is on some pages, but not the resources page or why only two pics show on some and four on others.  I would like to eliminate extra space but when I try to change the section height to Small from Medium the text runs over the images.  I would also like to have more of the photos visible, but having at least four is acceptable (if anyone knows how to keep more of the photos visible I would appreciate advice there as well).

Thank you--







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

Top Posters In This Topic

Top Posters In This Topic

Posted Images

This code for Resources Page

Try adding to Design > Custom CSS

@media screen and (max-width:767px) {
[data-section-id="610546cf93aa595288a1a51e"] {
    min-height: unset !important;
    height: 20vh;
    margin-top: 0vh;


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.