Solved

How to remove white space between footer and last section - Debut Theme Mobile only

funkypot
Tourist
4 1 0

Hey There,

I would like help in trying to remove the small white gap that appears between the last section and the footer. This gap is only visible on the mobile version not the desktop version.

I've tried various code fixes but none seem to do the trick. Any suggestions appreciated.

URL: funkypot.co.nz

password: poTheaD66!

Cheers,

M

Accepted Solutions (3)

suyash1
Shopify Partner
9077 1129 1479

This is an accepted solution.

@funkypot - add follwoing css to the end of your theme.css file, if any issues you can contact me on my given email

@media screen and (max-width:749px){
.index-section--flush:last-child {margin-bottom: -60px;}
}
To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI

View solution in original post

Jivan_Suhagiya
Shopify Partner
581 79 124

This is an accepted solution.

Hi,
Its margin issue,
change it to -55px to marked style in screenshot 

Jivan_Suhagiya_0-1611637268661.png

 

If helpful then please Like and Accept Solution.
Email: suhagiyajivan1992@gmail.com
Skype: jivan.suhagiya
First kind of Checkout Reminder APP: https://apps.shopify.com/checkout-reminder

View solution in original post

funkypot
Tourist
4 1 0

This is an accepted solution.

All good I found a fix with this code:

 

@_media only screen and (max-width: 749px) {
.site-footer__content {
text-align: center;
}
.site-footer__item {
justify-content: center;
}
}

View solution in original post

Replies 8 (8)

suyash1
Shopify Partner
9077 1129 1479

This is an accepted solution.

@funkypot - add follwoing css to the end of your theme.css file, if any issues you can contact me on my given email

@media screen and (max-width:749px){
.index-section--flush:last-child {margin-bottom: -60px;}
}
To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
funkypot
Tourist
4 1 0

Awesome @suyash1 thanks for the quick response. That resolved the white gap issue.

The only thing it changed was it did not keep the Menu Options centered on the footer. How would I center these and still retain everything else?

Cheers,

M

suyash1
Shopify Partner
9077 1129 1479
our css was not meant to change alignment but add this code too and check



*@media screen and (max-width:749px){. site-footer__item-inner {margin:0
auto;} }*
To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
funkypot
Tourist
4 1 0

Unfortunately @suyash1 that did not resolve the issue with the footer menus not being centered.

Appreciate the help though!

M

suyash1
Shopify Partner
9077 1129 1479
actually our code should not change the alignment, our code was to remove
space, this is very wierd
To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
funkypot
Tourist
4 1 0

This is an accepted solution.

All good I found a fix with this code:

 

@_media only screen and (max-width: 749px) {
.site-footer__content {
text-align: center;
}
.site-footer__item {
justify-content: center;
}
}

suyash1
Shopify Partner
9077 1129 1479
great that you found the code.
To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI

Jivan_Suhagiya
Shopify Partner
581 79 124

This is an accepted solution.

Hi,
Its margin issue,
change it to -55px to marked style in screenshot 

Jivan_Suhagiya_0-1611637268661.png

 

If helpful then please Like and Accept Solution.
Email: suhagiyajivan1992@gmail.com
Skype: jivan.suhagiya
First kind of Checkout Reminder APP: https://apps.shopify.com/checkout-reminder