Joshua Whalen Joshua Whalen - 3 months ago 7
CSS Question

Styling default validation tooltip

Is it possible to style the default tooltip? Here's a JSFiddle demonstrating the default tooltip.

<form>
<input type="text" placeholder="Hit submit without entering value!" required>
<input type="submit">
</form>

Answer

You can not change "default tooltip" (HTML5 validation bubble) - it is determinated by browser vendor and several other params like browser language.

You can, however, prevent validation bubble - by doing something like

<input placeholder="Lorem ipsum..." required oninvalid="myCustomFunction()" />

From now on, with myCustomFunction you can develop your own bubble.

Reference.

Comments