Vertical spacing between footer payment icons and social media icons

Shopify Discussion
,
1

Good day.

I am tired of trying to do this myself. Can anybody please assist with this.

I am trying to reduce the vertical spacing between the social media icons and the payment icons.

I am currently using Dawn theme.

Hader_1-1705094775716.png
Hader_1-1705094775716.png1865×501 26.7 KB

1 Like
2

Hi @Hader

Would you mind to share your Store URL website? with password if its unpublish. Thanks!

1 Like
3

Hi it is https://www.4u2buy.co.za

4

Hello.

Here are the steps:

  • Go to online store in the admin
  • Under the Themes menu click the drop-down next to the Customize button and select Edit Code
  • There is a search bar at the top type in: component-list-payment.css (or find it in your assets folder)
  • Next to adjust the payment icons you will find this selector: .list-payment__item (To search for this selector click anywhere on the page and hold down CTRL and click F; you will see a search bar pop up)
  • Notice the padding (default is 0.5rem) you can change this to 0.4rem or whatever you see fit.

Next to change the social icons:

  • In your assets folder find: component-list-social.css
  • Find: .link list-social__link
  • The default you will see is (1.1rem) you can reduce this to something like 0.7 rem or whatever size you see fit.

Play around with the numbers to see what size looks the best

Hope this helps.

1 Like
5

Thank you so much for the response.
I’ve tested it however the issue still remains.

I should have added that i added the Payment icons by editing the code in the footer.liquid section.

I am not sure if this makes any difference?

Hader_0-1705099737412.png
Hader_0-1705099737412.png1236×332 18.4 KB

1 Like
6

Thank you for all the efforts people. You are all amazing.

I found the solution.

It was in my section-footer.css

This line

.footer__content-top {
padding-bottom: 5rem;
display: block;

Had to be changed to:

.footer__content-top {
padding-bottom: 1rem;
display: block;

Thank you so much for the efforts everyone. I truly appreciate it.

1 Like