checkout page not working on handphone

Hi @kohkaihwee

Try the following CSS

@media only screen and (max-width: 480px) {
	#add_payment_method #payment div.form-row, 
	.woocommerce-cart #payment div.form-row, 
	.woocommerce-checkout #payment div.form-row {
	    padding: 0 10px;
	}
}

Copy and paste it in Appearance -> Customize – Additional CSS

Let us know if you have any questions

Best Regards

Thanks. It works, but it can’t show the full credit card details.
Attached is the picture.

https://drive.google.com/file/d/1z4Jz-O-0QqqofpZGrSCCtUQyFy0Vaz7j/view?usp=drivesdk

Is there a way to show the full credit card details?

Hi @kohkaihwee

Add a few more lines of CSS

@media only screen and (max-width: 480px) {

#checkout-wrapper .content-page {
    padding-right: 0;
}

.woocommerce-checkout #payment ul.payment_methods,
.content-inner .os-container {
	padding: 0;
}
}

Make sure, you clear your browser cache first before checking this page

Let us know if this helps you out

Best Regards

Thanks so much for your prompt reply

It looks great now