HTML Validation for a simple login form

Here let's see the simple validation for a login form using HTML5. Just add the name called 'Required' for the validation. For example in a input text box just add the field required in the tag.Live demo is shown below refer that one.

Index :

<div class="login">
<form action="" method="post">
<strong>Username &nbsp;&nbsp; </strong>
        <input autocomplete="off" class="search" name="username" placeholder="Enter your username" required="" style="width: 220px;" type="text" />
        <br />
<strong>Password &nbsp;&nbsp; </strong>
        <input autocomplete="off" class="search" name="password" placeholder="Enter your password" required="" style="width: 220px;" type="password" />
        <br />
<span style="margin-left: 120px;"><input id="submit" name="submit" style="margin-left: 50px;" type="submit" value="Login" />
</span>
<span style="margin-left: 120px;"><br /></span>
<span style="margin-left: 120px;"><br /></span>
<span style="margin-left: 120px;"><br /></span></form>
</div>

Style :

<style>
.login
{
    box-shadow: 0 0 2px 2px  #CCC;
    border-radius: 15px 15px 15px 15px; 
    padding: 10px; 
    float:left;
    margin:0 auto;
    width:370px;
}
.search
{
    
    padding: 8px 5px;
    margin: 0 0 10px 0;
    width: 238px;
    border: 1px solid #CCC;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -moz-box-shadow: 0 1px 1px #CCC inset;
    -webkit-box-shadow: 0 1px 1px #CCC inset;
    box-shadow: 0 1px 1px #CCC inset;
  }
  #submit{
    padding: 6px 10px;
    color: #fff;
    border: 1px solid #666666;
    border-top-color: #666666;
    border-bottom-color: #666666;
    background: #666666;
    background: -moz-linear-gradient(top, #999999 0%, #CCC 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#999999), color-stop(100%,#CCC));
    background: -webkit-linear-gradient(top, #999999 0%,#CCC 100%);
    background: -o-linear-gradient(top, #999999 0%,#CCC 100%);
    background: -ms-linear-gradient(top, #999999 0%,#CCC 100%);
    background: linear-gradient(top, #999999 0%,#CCC 100%);
    -moz-border-radius: 3px ;
    -webkit-border-radius: 3px;
    border-radius: 3px ;
  }
</style>

Username   
Password