Footer Reconfiguration - Mobile and Desktop

Topic summary

A Shopify store owner needs help with footer layout adjustments that differ between mobile and desktop views:

Requirements:

  • Desktop: Logo aligned left, footer menu aligned left
  • Mobile: Logo centered, footer menu centered

The user provided screenshots showing the current layout and shared their store URL with password access.

Solution Provided:
A community member offered CSS code to add to the section-footer.css file using media queries:

  • For desktop (min-width: 750px): Aligns logo to the left using justify-content: flex-start
  • For mobile (max-width: 749px): Centers both the footer heading and menu items

The solution included before/after screenshots demonstrating the corrected layout. The original poster confirmed the fix worked and requested additional help with a separate header-related issue.

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

Hello,

Is anyone able to assist my in…

  1. aligning my logo image to the left of the footer in desktop mode while keeping it centred in mobile mode

  2. centring my footer menu in mobile mode but keeping its alignment to the left in desktop mode

See Screenshots, Thankyou!

URL: https://www.livwithin.com.au/?_ab=0&_fd=0&_sc=1

PW: pewpog

Hi @ellacoker

Thanks for reaching out to the Shopify community!

To resolve your issue, try updating your section-footer.css file with the following code:

@media screen and (min-width: 750px){
	.footer-block-image.center {
	  justify-content: flex-start;
	}
}
@media screen and (max-width: 749px){
	.footer-block__heading {
	  text-align: center;
	}
	.footer-block__details-content .list-menu__item--link{
		justify-content: center;
	}
}

Output:

Desktop

Mobile:

thank you very much. is there any chance you could help me out with my header post?