How can I adjust the width of footer columns in my online store?

Topic summary

A user needs to adjust their Shopify store’s footer layout to make the first column wider while keeping the remaining two columns smaller.

Solution provided:

  • Navigate to Online Stores > Themes > More Actions > Edit code
  • Locate and edit the theme.liquid file
  • Add custom CSS code above the </head> tag to control column widths using percentage values

Additional requests resolved:

  • Reducing spacing between menu items in the footer’s quick menu section (solved with additional CSS code)
  • The user also posted a separate question about their collection page that the helper agreed to review

All proposed CSS solutions successfully resolved the footer styling issues.

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

I have three columns on my store’s footer, i need first column to be wider, and rest two colums to be smaller.

could you someone take a look and advise pls , here is the link to store :

Elegance Threads- Buy Pakistani Stitched clothes in USA (772de6.myshopify.com)

This is Noah from PageFly - Shopify Page Builder App

To adjust the width of the column footer you need to follow these steps:

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: Choose file theme.liquid and past code above the


Additionally, you can adjust the % value you want.

Hope my solution will help you resolve the issue.

Best regards,

Noah | PageFly

thank you very much that worked.

would you also be able to advise how to decrease the space between menu’s in quick menu section on footer ?

thank you

Yes, Sure. You can add code below to above the tag


Thank you for wating.

perfect you are a champ. could you also check a question i just posted about collection page.

Yes sure, I will check it.