Checkout page in two columns

Support
#1

Hello Staff,

  1. Actually mi checkout page is in one column, but I want something the image. “Billing details” and “Your order” in two columns and responsive. It’s possible?

  1. Payment options: look bad, a lot of space between them. Icons are not the same size. How can it be pleasing to the user?

  2. The check “terms and conditions” is not well alienated, it is more to the left. Please, how can I fix it?

My URL is: http://midentistry.es/finalizar-compra/

Thanks

#2

Hi There,

1.) See this: https://screencast-o-matic.com/watch/cbQI60I29z

div#customer_details {
    margin-right: 4%;
}
div#customer_details, #order_review {
    width: 48%;
    float: left;
    border: thin solid red;
}
h3#order_review_heading {
    margin-top: 0; /* To align header*/
}

2.) See this too: https://screencast-o-matic.com/watch/cbQI6vI29R

.woocommerce-checkout form .payment_methods li {
    margin-bottom: 0;
}

3.) Check this: https://screencast-o-matic.com/watch/cbQI6aI2Ro

.woocommerce-checkout form input[type="checkbox"] {
    margin-left: 0px;
}

For more design customization, feel free to use browser inspector. Once you select an element, it will be highlighted and on the right is the active styles. Feel free to override.

Hope this helps.