Add space payment icons footer

[Astrid_brae]

In the footer, my payment icons are stuck together. I’d like to add a space.

I have already tested this code : “ul.list.list-payment svg { margin: 0 5px; }” in theme.liquid but it’s not working

Thanks a lot

[nvchien]

Hi @Astrid_brae ,

Please share your store URL with storefront password. So I and other partners can check & help you.

Thanks.

[Dan-From-Ryviu]

Hi @Astrid_brae

You could try to add this code to theme.liquid file

[Astrid_brae]

Hi,

Thank you for you rreply.

I just tested, but it’s not working

[Astrid_brae]

www.daure.com

and password : julix

Thanks

[nvchien]

Thank @Astrid_brae ,

You can try to add this CSS code to bottom of 'base.bundle.css’ file

.shopify-section-group-footer-group .-mx-1 li {
   min-width:38px
}

Hope this helps.

[BSSCommerce-HDL]

Hi @Astrid_brae ,
Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file base.css, theme.css, styles.css or theme.scss.liquid

Step 3: Insert the below code at the bottom of the file → Save

.shopify-section.shopify-section-group-footer-group ul:has(.icon) {
    display: flex !important;
    justify-content: center;
    margin-left: -15px !important;
}

.shopify-section.shopify-section-group-footer-group ul:has(.icon) li {
    margin-left: 15px !important;
}

Here is result:

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you

[Astrid_brae]

Thanks.

I don’t have : base.css, theme.css, styles.css or theme.scss.liquid…

I have theme.liquid or base.bundle.css

[BSSCommerce-HDL]

Hi @Astrid_brae ,
Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file theme.liquid

Step 3: Inside head tags. You need create style tags. After insert my code inside style tag

.shopify-section.shopify-section-group-footer-group ul:has(.icon) {
    display: flex !important;
    justify-content: center;
    margin-left: -15px !important;
}

.shopify-section.shopify-section-group-footer-group ul:has(.icon) li {
    margin-left: 15px !important;
}

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you

[Astrid_brae]

It’s working Thank you very much !

[Dan-From-Ryviu]

I added the code for the Dawn theme, but I see you posted your store URL and it is not the Dawn theme. Also, you got the solution from @nvchien . Please feel free to let us know if you need more question.