Adjust Menus in Footer

Store Design
,

Topic summary

A user seeks to align footer menus horizontally, specifically moving the “Wholesale” menu to sit beside the “Contact” menu instead of below the social icons.

Multiple solutions provided:

  • Modify the .footer .medium-6 CSS class in app.css or base.css
  • Change the flex property from 0 0 50% to 0 0 33% (or 30%) using a media query for screens min-width 48em/600px
  • One responder suggests changing the HTML class from medium-6 to medium-4 directly in the theme code

Technical approach:
All solutions target the same issue: adjusting column width percentages in the footer’s responsive grid layout. The fixes involve navigating to Shopify Admin → Online Store → Themes → Edit Code → Assets → app.css (around line 835) and modifying the media query.

Resolution: The original poster confirmed the solution worked with a “Perfect. Thank you!” response, marking the issue as resolved.

Summarized with AI on November 7. AI used: claude-sonnet-4-5-20250929.
2

@JoeyRoo - please add this css to the very end of your app.css file and check,
Shopify Admin → Online Store ->Theme → Edit code → app.css

@media screen and (min-width:48em){
#footer .row .medium-6{flex: 0 0 33%;}
}