The empty pattern attribute causes Webkit (Chromium 25) to style the URL and Email HTML5 form fields always with :invalid styles.
|Reported by:||nico23||Owned by:||nacin|
|Severity:||normal||Keywords:||dev-feedback ui-feedback ux-feedback|
Chromium Version 25.0.1364.160 Ubuntu 13.04 (25.0.1364.160-0ubuntu3)
input type="email" pattern=""
input type="url" pattern=""
This code is generated for the HTML5 form in Wordpress.
I am using bootstrap 3.0 CSS and it styles the input:focus:invalid:focus and input:focus:invalid with a red border and text. The issue is using the empty pattern variable the browsers marks everything as invalid. I simply removed the pattern="" and the validation works, the browser then uses default pattern and the styles get removed as soon as the input in that fields are valid. I not tested it with manual pattern that will of course work as well.
Not sure what the reason is you used empty pattern, I am new to this thing, but you might want to remove it or include some default pattern to be able to correctly validate the Email and URL.