Hello.
Please add the below given CSS.
/*———- Extra- Woocommerce css for checkout page————–*/
.woocommerce-checkout.woocommerce-page .col-2,
.woocommerce-checkout.woocommerce-page .col-1 {
-ms-flex: 0 0 8.333333%;
flex: 0 0 100%;
max-width: 100%;
}
.woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-2,
.woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1 {
width: 100%;
}
.woocommerce-checkout.woocommerce-page .woocommerce-form__label,
.woocommerce-checkout.woocommerce-page .woocommerce-input-wrapper{
width:100%;
}
This will fix your design issue on checkout page.
Thanks
Sorry but that doesn’t seem to help or I put the css code in the wrong place.
I put it under Apperance -> Customize -> Theme Options -> Theme General Options -> Custom CSS.
Although you are on right way to do it.
But Please get the recent update 5.35 , This will help you in fixing the checkout page design.
Thanks
Sorry, upgraded to 5.35 but still no luck. Did also upgrade wordpress to 5.3 but the login page is still broken.
Kindly do the following
1) Clean your cache and check.
2) Remove the css if you put it the custom css editor box.
Thanks
Doing the testing in a “New Private Window” to have a clean env plus tested on a different account, same problem.
Tested with and without the css.
Hello again,
Did you edited the woo-commerce html file ??
Your HTML should be similar to [ https://pastebin.com/yYS0pzLu ]
This is what breaking the HTML
Thanks
Finally managed to find time to get back to this.
No, I haven’t touched any HTML or php code anywhere.
I now first upgraded everything except enigma theme to latest available, all looked ok. Then I upgraded enigma theme to 5.36 and https://qa.meinenigma.com/my-account/ got messed up.
/ps
Finally bit the bullet and upgraded everything but still no luck getting the login page to work. Did some debugging and managed to create some new css code so now it does at least work but I have now clue if it’s correct way to fix the problem.
.woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1 {
float: left;
width: 48%;
max-width: 100%;
}
.woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-2 {
float: right;
width: 48%;
max-width: 100%;
}
