Re: How to remove padding under payment methods?

How to remove padding under payment methods?

DaveyAlcatraz
Explorer
63 0 13

Hi everyone,

I am currently using a completely free third party app to display payment method icons which is fantastic. My only concern is the amount of padding at the bottom of the section itself is a bit uneven. I don't have settings to alter this and it doesn't appear I can use custom CSS on this particular section of the website so I was wondering how to even out the gaps. I've attached a photo but I also have a link for you to inspect here.

 

DaveyAlcatraz_0-1724222954362.png

 

Please advise.

Replies 6 (6)

Hung5
Shopify Partner
8 0 1

You can using class="itsapp" and add margin-top is modify it 

Hung5_0-1724223788246.png

 

 

DaveyAlcatraz
Explorer
63 0 13

Thank you, whereabouts would I place this?

Hung5
Shopify Partner
8 0 1

1. You click Edit code > find main-product > copy code .itsapp{
margin-top:15px;
} in below {%- style -%} 

2. If you using  <style>
itsapp{
margin-top:15px;

</style> it is code is on product-info

 

 

BSSCommerce-HDL
Shopify Partner
2305 834 906

Hi @DaveyAlcatraz 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag:

 

<style>
product-info section:nth-child(11) {
    display:none!important
}
    .itsapp {
        padding-bottom: 0!important;
    }
</style>

 

Step 4: Insert this code above </body> tag:

 

<script>
    document.querySelector("section.description").style='padding-top:0!important'
</script>

 

Here is result:

BSSCommerceHDL_0-1724227099831.png

 

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 😍

 

Sale banner, pop ups: Customize your sale banner, pop-ups and create countdown bar to boost conversion rate.
Simicart: Transform your Shopify store into a stunning and fully functional mobile app with just a few simple steps.
Product Labels & Badges:
Get more sales with striking labels, badges, and banners from our 10,000+ available templates.

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

DaveyAlcatraz
Explorer
63 0 13

Hi, thanks for your solution I really should've looked at the screenshot of the result prior to actioning, I was acting in haste. Unfortunately that's not quite what I wanted it has now removed the free shipping section which I am struggling to work out how to reverse.

DaveyAlcatraz
Explorer
63 0 13

All fixed now, I appreciate your help. I think I will leave it to someone more capable than I to avoid any further mistakes. Thank you 🙂