How to decrease Space between Footer Menu links

[Donnie202]

Hello Everyone,

I am trying to reduce the spacing between the Footer menu links in my website. Any help would be much appreciated. Thanks!

Here is an image reference of what I mean

https://ibb.co/JCrvGX9

My website URL is

Singletary Fishing Co. – SingletaryFishingCompany

Password

Singletary

[codewiser]

Hello @Donnie202 

Step 1: Go to Online Store -> Theme -> Edit code.
Step 2: Search file base.css
Step 3: Paste the below code at bottom of the file -> Save

@media screen and (min-width: 750px){
    .footer .grid .footer-block--menu:nth-child(2n) {width: 10%;}
}

[Donnie202]

Hi @codewiser . Thank you for the input but it didn't work. What I'm trying to do is to reduce the wide spacing between the footer menu blocks.

https://ibb.co/JCrvGX9

Like reducing the space between the "Quick Links" section and the "Company Info" section.

Thanks.

[BSS-Commerce · Accepted solution]

Hi @Donnie202 

This is BSS Commerce - Full-service eCommerce Agency. We'd love to suggest you this solution:

Step 1:  Online store -> themes -> edit code

Step 2: Search file base.css

Step 3: Insert this code at the end of the file, and then click "Save"

.footer-block.grid__item.footer-block--menu {
    width: 0%;
    margin-right: -200px;
}

If you want to increase the distance between the two menus, you can increase the margin-right property.

The result will be like this:

Hope this helps you.

---------

BSS Commerce - Shopify Apps & Development Services Provider - Shopify Expert

Level up your Shopify store with our B2B & B2C apps

[Donnie202]

Hi @BSS-Commerce 

This works. Thank you!

Please how can I adjust the spacing on mobile?

https://ibb.co/3vDs0W1

Much appreciated.

[Donnie202]

Done already. Thanks.

[PlaySub]

Hello @BSS-Commerce 

would you mind helping me out to fix the same issue in Mobile? I need to reduce the spacing between the footer blocks.