Woocommerce Bootstrap 4 CSS Columns Cart Fix

Author: Aleš Sýkora, 8. 10. 2019

Woocommerce uses same CSS classes for their cart columns. It makes some problems with Bootstrap 4. So if you use Toolset and Bootstrap 4, your cart will be propably messed up.

The fix is to change the width of woocommerce col-1 and col-2 to unset.

Here’s the trick:

.woocommerce-billing-fields .form-row, .woocommerce-shipping-fields .form-row,.woocommerce form .form-row {
display: block;
}
 
.woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1,.woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-2 {
max-width: unset;
}

Thanks to muktoapb who came up with the workaround at the original issue on github.