How to increase space between menu items while maintaining all columns in one row

[MarielSalcedo]

Hello, I need help with this. I want to increase the space between the 4 columns on my footer but maintaining all columns in one row. I have tried other solutions but they move the last column into another row. 

[AHAY]

Depends on your theme you may be able to do it in the theme settings or by adding a custom css. What theme are you using ?
If doable in the theme settings, you should see so when you click on the relevant section/blocks when in the Theme > Customize. Look for 'Spacing' options. Again this depends on your particular theme. If not, then it should be easy done by adding custom css after figuring out which html element(s) you need to modify. I'm familiar with Dawn theme but I think the principles above should be the same.

[PageFly-Richard · Accepted solution]

Hi @MarielSalcedo 

This is Richard from PageFly - Shopify Page Builder App

Please add this code to your theme.liquid above the </head> to get this solved

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

Step 2: click on theme.liquid and paste the code above the </head>

<style>
@media (min-width: 767px) {
.footer__blocks-wrapper.grid {
column-gap: 20px ;
}
.footer__blocks-wrapper .footer-block.grid__item {
    width: 20% !important;
}
}
</style>

If you want to increase or decrease gap, simply increase the 20px value 

Hope this can help you solve the issue 

Best regards,

Richard | PageFly

[MarielSalcedo]

@PageFly-Richard thank you so much!! This worked wonders. Grateful for your help.