cancel
Showing results for 
Search instead for 
Did you mean: 

css for paypal button container spacing

SOLVED

css for paypal button container spacing

I want to create a 5px space between the Add to Cart button and the PayPal buttons. The Add to Cart button and PayPal pay now button are touching and I'd like to give them a little visual breathing room. I've tried adding css in the customization settings (store>porto settings panel), but I'm obviously not getting it right. I see there is a paypal-button-container class as well as an iframe. I've tried modifying both in the customized settings, but with no luck, so I'm using the wrong ID. I need either a 5px padding or 5px margin, either top of the PayPal button container or bottom of the Add to Cart button.

Thank you.

example:

https://www.blueplanetphoto.com/store/before-you-buy.html 

1 ACCEPTED SOLUTION

Accepted Solutions

Re: css for paypal button container spacing

Here is the solution. In your customization settings, add this CSS. The key element is margin-bottom: nnpx; Here, the margin is 5px, but I used 10px. 

 

.catalog-product-view:not(.weltpixel-quickview-catalog-product-view):not(.weltpixel_quickview-catalog_product-view) .box-tocart .action.tocart {
    height: 43px;
    font-size: 14px;
    letter-spacing: 0.05em;
    font-weight: 400;
    margin-bottom: 5px;
}

View solution in original post

3 REPLIES 3

Re: css for paypal button container spacing

There's no fix for this?

Re: css for paypal button container spacing

Is there any solution for this problem, if yes then please provide me, my friend, just faced this problem mygiftcardsite

Re: css for paypal button container spacing

Here is the solution. In your customization settings, add this CSS. The key element is margin-bottom: nnpx; Here, the margin is 5px, but I used 10px. 

 

.catalog-product-view:not(.weltpixel-quickview-catalog-product-view):not(.weltpixel_quickview-catalog_product-view) .box-tocart .action.tocart {
    height: 43px;
    font-size: 14px;
    letter-spacing: 0.05em;
    font-weight: 400;
    margin-bottom: 5px;
}