Unabel to change Checkout Page Columns
-
Hey, I have tried to manually change the column size of Checkout Page Columns but its not changing the design. By default it is “col-sm-6 & col-sm-6” I want it them be:
- col-lg-8 col-md-8 col-sm-12 col-xs-12 on Billing Columns
- col-lg-4 col-md-4 col-sm-12 col-xs-12 on Order Details Columns
Hello,
You can edit this page content and HTML markup in the file woodmart/woocommerce/checkout/form-checkout.php
.
Regards
I have changed the layout but it doesn’t change the layout. Instead it gives 100% width to both. Please see the screenshot attached.
Attachments:
You must be
logged in to view attached files.
Try to add the following code snippet to the Custom CSS for desktop devices area in Theme Settings
form.checkout>.col-sm-6:first-child {
flex: 1 1 66%;
max-width: 66%;
width: 66%;
}
form.checkout>.col-sm-6:last-child {
flex: 1 1 34%;
max-width: 34%;
width: 34%;
}
And this part for tablet and mobile devices
form.checkout>.col-sm-6:first-child,
form.checkout>.col-sm-6:last-child {
flex: 1 1 100%;
max-width: 100%;
width: 100%;
}
Thank You! You’re awesome!