How to style input validationMessage

39 Views Asked by At

input type email has the validationMessage "Please include an @ in the email address. 'John' is missing an @.". When I attempt to submit the form, this message displays, how can I style this message?

1

There are 1 best solutions below

0
On BEST ANSWER

"Implementing a customized error message As you saw in the HTML validation constraint examples earlier, each time a user tries to submit an invalid form, the browser displays an error message. The way this message is displayed depends on the browser.

These automated messages have two drawbacks:

There is no standard way to change their look and feel with CSS. They depend on the browser locale, which means that you can have a page in one language but an error message displayed in another language, as seen in the following Firefox screenshot."

This is not possible yet.

https://developer.mozilla.org/en-US/docs/Learn/Forms/Form_validation#Customized_error_messages