How To Remove Space Above Footer on Debut Theme?

Solved
PickleKing
Excursionist
26 0 11

Hi there, I'm looking to remove the space above the footer on all my pages:

Screen Shot 2021-02-27 at 14.53.59.png

I would like it removed on all pages, including on both Desktop & Mobile view.
My preview link is: https://7b1mgv8h27wd8ehw-53754724549.shopifypreview.com

I have tried looking around for many solutions but there isn't any that work for me.
If anyone can help with that simple code, that would be appreciated. Many thanks. 

0 Likes
dmwwebartisan
Shopify Partner
7283 1720 2290

@PickleKing 

I checked your website. Your footer is fine no space above the footer. Could you please let me know which page you have the problem?

Please provide that page URL.

 

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes
PickleKing
Excursionist
26 0 11

Hi, thanks for your reply. 

It shows on the "ABOUT" page here: https://double-chin-deli.myshopify.com/pages/about-us

It doesn't show on the homepage because the image at the bottom is "Image with Text Overlay".
For the about page, I did some HTML coding to input the image. 

Thanks for any help

dmwwebartisan
Shopify Partner
7283 1720 2290

@PickleKing 

Thanks for the information but about us page asking for the password. Please provide.

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes
PickleKing
Excursionist
26 0 11

Hi, sorry about that, I have now disabled the password so it should be accessible now. 

Thanks

dmwwebartisan
Shopify Partner
7283 1720 2290

This is an accepted solution.

@PickleKing 

Please add the following code at the bottom of your assets/theme.css file.

.template-page .site-footer{ margin-top: -6px !important; }

 

Hope this works.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
PickleKing
Excursionist
26 0 11

Thank you so much for the solution! The fix can be seen on both Desktop & Mobile view.

However, now there is a space above the footer on the homepage only for both Desktop & Mobile view. 
The difference is, on the homepage, the image at the bottom is "Text with Overlay" whereas the images on the bottom of the other pages were input using HTML. Not sure if that should make any difference, but just letting you know.

Any tips on how to reduce the space above the footer on the homepage?

0 Likes
PickleKing
Excursionist
26 0 11

Hi again,

So now the space above the footer is actually only appearing on the homepage on Mobile view. It appears fine on Desktop view, and other pages are fine on both Desktop & Mobile view.

Any tips on how to remove the space above the footer for the homepage on Mobile view?

**EDIT**: So actually there still is a space above the footer on the homepage on Desktop, it only appears when I make the window smaller. 

dmwwebartisan
Shopify Partner
7283 1720 2290

@PickleKing 

Please add the following code for the mobile.

@media only screen and (max-width: 749px){
.site-footer{ margin:35px; }
}

 

Hope this works.

Thanks! 

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
PickleKing
Excursionist
26 0 11

Thank you for your response!

I have input the code and it did help, but now on Mobile view the footer is minimized on the sides - this also appears when you make the window smaller on Desktop view.

Is there any way to keep the footer full width on Mobile view / Smaller windows on Desktop view?