Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
BradleyStearn

Removing blank space on mobile version of site

Recommended Posts

Site URL: http://bradleystearn.co.uk/

I'm struggling to find a way to remove the negative/blank space on the mobile view of my website. Viewing on desktop the design is how I would like it, swithcing to a mobile view you'll see a lot of negative white space between my header, and the image slideshow. I've been hunting around the design section of the edit menu, but cannot find a way to remove this space, which doesn't affect the design of the desktop version. 

http://bradleystearn.co.uk/

Thank you

Share this post


Link to post
9 hours ago, tuanphan said:

Add to Home > Design > custom CSS


@media screen and (max-width:767px) {
[data-section-id="5e80c87763d7965a88ad6cce"] .gallery-slideshow {
    height: 400px !important;
}
}

 

Thank you very much, this did the job.

Share this post


Link to post
Posted (edited)
On 4/10/2020 at 10:20 PM, tuanphan said:

Add to Home > Design > custom CSS


@media screen and (max-width:767px) {
[data-section-id="5e80c87763d7965a88ad6cce"] .gallery-slideshow {
    height: 400px !important;
}
}

 

 

Hi, I am having the same issue with extra negative space on the mobile only view, but unfortunately this code is not working for my site on mobile. Below is my site and password. Could you help me solve this?

https://hulseygardens.squarespace.com/

password:1234

Thank you so much in advance.

Screen Shot 2020-04-25 at 12.35.44 AM.png

Edited by CarolynSmith

Share this post


Link to post
2 hours ago, CarolynSmith said:

 

Hi, I am having the same issue with extra negative space on the mobile only view, but unfortunately this code is not working for my site on mobile. Below is my site and password. Could you help me solve this?

https://hulseygardens.squarespace.com/

password:1234

Thank you so much in advance.

 

Add to LAST LINE in Home > Design > Custom CSS

@media screen and (max-width:767px) {
#page article section:first-child {
    padding-top: 20px !important;
}
}

 


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

Share this post


Link to post
9 hours ago, tuanphan said:

Add to LAST LINE in Home > Design > Custom CSS


@media screen and (max-width:767px) {
#page article section:first-child {
    padding-top: 20px !important;
}
}

 

This worked perfectly! Thank you!! 

Share this post


Link to post
Posted (edited)

My site is here https://fourreign.squarespace.com/ password: PBnJJ2020

The gallery has such a high top and bottom white space. Any help on reducing it would be greatly appreciated! 

On 4/25/2020 at 12:54 AM, tuanphan said:

Add to LAST LINE in Home > Design > Custom CSS


@media screen and (max-width:767px) {
#page article section:first-child {
    padding-top: 20px !important;
}
}

 

 

Edited by fourreign

Share this post


Link to post
On 5/4/2020 at 5:15 PM, fourreign said:

My site is here https://fourreign.squarespace.com/ password: PBnJJ2020

The gallery has such a high top and bottom white space. Any help on reducing it would be greatly appreciated! 

 

Add to Home > Design > Custom CSS

.gallery-slideshow {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

 


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

Share this post


Link to post

Hi, 

I have tried variations of this code on my site but nothing seems to work. I really want to remove the blank space at the top of the page just after the menu, and further down where the video is, both on the mobile view. 

https://www.corporate-away-days.co.uk/ this is the website, would you be able to help?

Share this post


Link to post

Add this

@media screen and (max-width: 640px) {
    div#block-yui_3_17_2_1_1579543118649_5751 .embed-block-wrapper {
        padding-bottom: !important;
        background-color: #c9e9f6
    }

    section#cadvideo {
        min-height: unset !important;
        height: auto !important
    }

    .homepage .Parallax-item:nth-child(2) {
        width: 100% !important;
        left: 0 !important;
        height: auto !important
    }
}

 


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

Share this post


Link to post

Hi! My website also has a lot of blank space above and below my slideshows on the home page when in Mobile. I am trying the codes above but not having luck. I may be doing it wrong though. Would someone look at it? It is meaganleighphoto.com. Thanks!!

 

Share this post


Link to post
6 hours ago, megj192332 said:

Hi! My website also has a lot of blank space above and below my slideshows on the home page when in Mobile. I am trying the codes above but not having luck. I may be doing it wrong though. Would someone look at it? It is meaganleighphoto.com. Thanks!!

 

Can you share access password?


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

Share this post


Link to post
Posted (edited)
On 6/20/2020 at 10:14 AM, michelle2 said:

@tuanphan Wondering if this is similar to whats going on this the site im building? It has a black space on every single page on mobile.

https://emu-tuatara-5dd6.squarespace.com/

Password: hls123

Would really appreciate help I'm going stir crazy

Add to Home > Design > Custom CSS

@media screen and (max-width:640px) {
body {
    margin-top: 0 !important;
}
}

 

Edited by tuanphan

You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

Share this post


Link to post
On 7/3/2020 at 8:34 PM, Handford said:

Hi there - I've got the same issue on my end. 

On mobile, there's a lot of padding either on the photo or the banner. Please see image attached to see what I mean.

Can you please assist? https://www.handford.com/

  

Add to Home > Design > Custom CSS

@media screen and (max-width:767px) {
.homepage #page section:first-child {
    min-height: 40vh !Important;
}
}

 


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...