Snippets: Display WooCommerce Checkout in Single Column

By default the WooCommerce checkout page is split in 2 columns with Billing Details on the left and Additional Information on the right. However, you can easily make the checkout a single column using a little CSS.

.woocommerce .woocommerce-checkout .col2-set .col-1,
.woocommerce .woocommerce-checkout .col2-set .col-2 {
    width: 100% !important;

.woocommerce .woocommerce-checkout .col2-set .col-1 {
    margin-bottom: 30px;
All CSS snippets should be added via a child theme's style.css file or using the built-in Custom CSS panel.