Customise woocommerce checkout page column width

Hi Gilles,

Try this CSS:

@media(min-width:769px) {
.woocommerce-checkout h3#order_review_heading {
    display: none;
}

.woocommerce-checkout form.checkout.woocommerce-checkout {
    display: flex;
    justify-content: space-between;
}

.woocommerce-checkout div#customer_details {
    width: 40%;
    margin-right: auto;
}

.woocommerce-checkout div#order_review {
    width: 55%;
}
}

Hi Ying,
Thank you for your reply.
But your code leaves a large space between the 2 columns: https://i.imgur.com/JMQ4lAb.jpeg

Can you link me to your checkout page?

yes, of course : https://www.un-jardin-bio.com/commander/
To clarify my request, my goal is to widen the right column (so that it takes less height)

When I tested the code in the developer tool, it seems working well:
https://www.screencast.com/t/tSx8tXMu71u

Can you add the CSS to the top of your CSS field to eliminate syntax errors from your other CSS code?

Sorry,
I forgot the end of the code
.woocommerce-checkout div#order_review {
width: 55%;
}
It works well.
Thanks a lot.

Glad to hear that :)