Jump to content

Can We validate Form Fields with CSS3?


Safeer008
 Share

Recommended Posts

Neither HTML 5 nor CSS 3 can do that. Javascript necessary to validate form fields. HTML is for describing data and CSS only deals with presentation. You use Javascript to manage behavior.

Link to comment
Share on other sites

well this is debateable.....we can tell the visitor whether they are filling form correctly or not through css you dont need javascript....

 

CSS.....

 

<style type="text/css"> input:valid {background-color:#a8e48e;} input:invalid {background-color:#fb9d9d;} input[type=text], input[type=email], input[type=number] {box-shadow:none;width:500px;height:25px;border:none;padding-left:10px;} input[type=submit] {background-color:white;width:100px;height:30px;box-shadow:none;border:1px solid green;cursor:pointer;}</style>

 

 

HTML

 

<form action="" method="get"> <input name="" type="text" required><br><br> <input name="" type="email" required><br><br> <input name="" type="number" required ><br><br> <input name="" type="submit" value="Submit"></form>

 

P.S - Check the :valid and :invalid browser compatibility.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...