I want to center my footer menu on mobile only and I want to reduce the blank space on the bottom

Topic summary

A user seeks help with two mobile footer styling issues on their Shopify store:

Problems identified:

  • Footer menu needs to be centered on mobile devices only
  • Excessive blank space at the bottom of the footer (illustrated in an attached screenshot showing uneven spacing)

Proposed solution:
One responder suggested adding CSS code to section-footer.css:

.footer-block__details-content {
  margin-bottom: -5rem;
  justify-items: anchor-center;
}

Current status:
The CSS solution did not resolve the issue. The original poster confirmed it doesn’t work and is still seeking assistance. Another community member requested the store URL and password to investigate further, but no follow-up has been provided yet.

Unresolved: The discussion remains open with no working solution implemented.

Summarized with AI on October 28. AI used: claude-sonnet-4-5-20250929.

Hi I want to center my footer menu on mobile on my website. I also want to reduce the blank space on the bottom (look at the picture the red need to be the same size as the green).

Thanks

2 Likes

Hello @imazele
Thank you for submitting your query to the Shopify community. I’d be happy to assist you. Could you please provide the store URL and password (if it’s password-protected) so I can review and get back to you with an update?

Hello @imazele
Go to online store ----> themes ----> actions ----> edit code ----> assets ----> section-footer.css
add this code at the end of the file and save.

.footer-block__details-content {
margin-bottom: -5rem;
justify-items: anchor-center;
}

result

If this was helpful, hit the like button and accept the solution.
Thanks

It doesn’t work! Can you help me please ?