css - How to display red borders on required or invalid value input element in Chrome just like Firefox behaviour for HTML5 validation? -


i have bring red borders around input element in chrome on html5 validation of firefox.

firefox validation

i have search lot unable find precise answer. of how using css appreciated.

thank you.

you use :valid pseudo class.

to shamelessly copy code https://developer.mozilla.org/en-us/docs/web/css/:valid:

input:invalid {    background-color: #ffdddd;  }  form:invalid {    border: 5px solid #ffdddd;  }  input:valid {    background-color: #ddffdd;  }  form:valid {    border: 5px solid #ddffdd;  }  input:required {    border-color: #800000;    border-width: 3px;  }
<form>    <label>enter url:</label>    <input type="url" />    <br />    <br />    <label>enter email address:</label>    <input type="email" required/>  </form>


Comments

Popular posts from this blog

timeout - Handshake_timeout on RabbitMQ using python and pika from remote vm -

gcc - MinGW's ld cannot perform PE operations on non PE output file -

c# - Search and Add Comment with OpenXML for Word -