menu

Questions & Answers

HTML form validation popup not readable in Chrome and IE

When an input with HTML validation is at the bottom of the browser window, the HTML form validation popup will appear "outside" the browser window, i.e. it will not be possible to read it.

The popup works fine with Firefox, but it is not readable with Chromium 51.0 or with IE10 or IE11.

Is this simply a browser bug, or do I have any possibility to influence it?

Here's the HTML that causes problems when I do not enter a valid email address:

<form>
  When you type something into the field below that is NOT an email address and click "Submit" the HTML5 validation popup will appear outside the window in Chrome.
  <div class="right-bottom">
    <input type="email" placeholder="email" required="true" />
    <input type="submit" value="Submit" />
  </div>
</form>

I've created a fiddle to show the problem: https://jsfiddle.net/gy8vhLz9/2/

Answers(1) :

I conclude that HTML5 validation is not yet matured. We should use something else.

Here is a Chromium issue where it is stated that we cannot style the error messages.