WooCommerce checkout - strange spacing

Hi Themeco team,

The spacing on my Woocommerce checkout is looking very un professional - see here (between tick boxes and description) > https://www.screencast.com/t/HYuRaWVe

Can you let me know how to fix this?

Do I have styling which is impacting this?

My site > www.honestyforyourskin.co.uk

Thanks,

Cheryl

Hello Cheryl,

Thanks for writing in!

This is because MailChimp Newsletter addon is overriding the styling. To resolve your issue, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

input[type="checkbox"]{
    margin-right: 10px;
}

We would love to know if this has worked for you. Thank you.

Hi Ruenel,

Thank you so much - works like a dream! And here I was thinking it was going to be a long winded (and stressful) fix. You’re a superstar.

There’s one last formatting quirk which looks unprofessional. Where PayPal is mentioned there’s a strange in dent > https://www.screencast.com/t/ssCexew10gLH

Is there a quick fix for this too? I have my fingers crossed.

Thanks,

Cheryl

Hi Cheryl,

To remove the indent on that “What is Paypal” label, please add this to Theme Options > CSS as well.

.woocommerce-checkout form .payment_methods label[for="payment_method_paypal"] {
	padding-left: 0;
}

Please do note that further customization from here would be outside of the support that we can offer.

You can find the proper CSS code selector using the Chrome browser Developer Toolbar
For the CSS code itself, I suggest that you get started with this tutorial

Thanks,

Thank you so much Friech - and also for the article pointers. I’ll be giving those a thorough read.

You’re most welcome, Cheryl.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.