Jump to content

Footer looks different on home page (mobile)

Recommended Posts

Site URL: https://www.thedesignguild.co/

I'm working on fine tuning the mobile view of my site and noticed that the footer on the home page on mobile view looks different that the other pages. There is this weird gap at the top - it is looking like the left on the home page but should look like the right which is happening on every other page). Anyone know what might be going on here? Thanks in advance 🙂

 

1621015760_ScreenShot2022-05-10at12_54_11PM.png.bfd1f1d2733a808b56592c57cf6b9d2f.png2068590640_ScreenShot2022-05-10at12_54_25PM.png.4cfbab470b15ddea8808205f26e179b3.png

Link to comment

This Custom CSS caused problem (first 4 lines)

@media only screen and (max-width: 768px) {
    .homepage section:first-child {
        height:30vh !important;
        min-height: 100vh !important
    }

    #collection-61a528924f8ad16b8e7dc960 section:first-child {
        height: 30vh !important;
        min-height: 100vh !important
    }
}

Change it to

@media only screen and (max-width: 768px) {
    .homepage article section:first-child {
        height:30vh !important;
        min-height: 100vh !important
    }

    #collection-61a528924f8ad16b8e7dc960 article section:first-child {
        height: 30vh !important;
        min-height: 100vh !important
    }
}

Because section:first-child appears on both Main Content & Footer. I added "article", means target first section on Main Content only

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

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.