WooCommerce checkout page is messed up

[franky]

Hello,

The checkout for wooCommerces isn’t what it’s supposed to look… I think it’s because of these styling.

Is there a way to fix?

Grtz,
Franky

[Alaa]

Hi Franky,

I checked your website and I can tell these styling issues are because of this file in your child theme directory:
/pro-child/node_modules/bootstrap/scss/mixins/_grid-framework.scss

If you don’t recognize this file, I recommend taking a backup first then delete it and reload your checkout page.

Thanks.

[franky]

Hello,

Thanks for this… I can’t find the file but see a line in style.css.map

How to proceed?

[thai]

Hi There,

To fix this issue, please add this custom CSS under style.css file locates in your child theme or Pro > Theme Options > CSS:

#customer_details {
    display: flex;
}

#customer_details .col-1,
#customer_details .col-2 {
    width: 50%;
    max-width: 100%;
    flex: 1 0 auto;
}

Regards!

[franky]

Works like a charm…

Thanks for your time!!

[basanta]

You are most welcome!