Return to previous page

Checkout on validation fields overlapping

This topic has 4 replies, 3 voices, and was last updated 1 month, 2 weeks ago ago by Tony Rodriguez

islam

Participant

January 28, 2026 at 08:37

On checkout page, leave the fields empty and submit, fileds’ name overlap with validation message. The attached image is from safari on iPhone.

Files is visible for topic creator and
support staff only.

#465020 Copied

3 Answers
Jack Richardson

Support staff

January 28, 2026 at 14:22
Hello @islam,

Please check it now. We have added the following custom CSS in “Theme Options → Global CSS”:

.template-content .et-advanced-label.woocommerce-invalid label[for] ~ p[class*=error-message] { position: absolute; top: calc(100% + 5px); } .template-content .et-advanced-label.woocommerce-invalid:has(label[for] ~ p[class*=error-message]) { margin-bottom: 40px; }

Frontend result: https://gyazo.com/f9ae3bf5b34aba0e963d29192ac8095a

Best regards,
Jack Richardson
The 8Theme’s Team
#465061 Copied
islam

Participant

March 23, 2026 at 07:19

Thanks for the support! My topic “Checkout on validation fields overlapping” has been successfully resolved.

#467710 Copied

Tony Rodriguez

Support staff

March 23, 2026 at 07:19

Dear islam,

Thanks for being part of our WordPress & WooCommerce community!

We’re happy we could assist you. Your feedback truly matters — it helps us make XStore better, faster, and more reliable with every release.

Leave Feedback →
(takes less than a minute)

Together, we’re shaping a better WooCommerce experience for everyone.

Topic closed.
The 8Theme Team

#467711 Copied
Viewing 4 results - 1 through 4 (of 4 total)