Cool Text Box Like Android Style

Make Android style text box using CSS3

HTML Textbox android style design using css3
<div class="holder">
    <input type="text" placeholder="First Name" />
    <div class="mask-left"></div>
    <div class="mask-right"></div>
    <div class="mask-top"></div>
</div>
<div class="holder">
    <input type="text" placeholder="Last Name" />
    <div class="mask-left"></div>
    <div class="mask-right"></div>
    <div class="mask-top"></div>
</div>
<div class="holder">
    <input type="text" placeholder="Email *" required="required" />
    <div class="mask-left"></div>
    <div class="mask-right"></div>
    <div class="mask-top"></div>
</div>
.holder{border:2px solid gray;height:30px;width:200px;position:relative;color:gray;margin:10px}
div.holder:hover{border:2px solid #33b5e5}
.holder input[type=text]{height:28px;border:0;width:95%;font-weight:700;outline:none;color:gray;font-size:18px;padding-left:5px;padding-right:5px}
.holder input[type=text]:focus{color:#000}
.holder input[type=text]:focus[required=required]{background-color:#f1d1d1}
.holder .mask-left{position:absolute;top:-2px;left:-2px;width:2px;height:80%;background-color:#fff}
.holder .mask-right{position:absolute;top:-2px;right:-2px;width:2px;height:80%;background-color:#fff}
.holder .mask-top{position:absolute;top:-2px;left:0;width:100%;height:2px;background-color:#fff}
DEMO
Cool Text Box Like Android Style Cool Text Box Like Android Style Reviewed by Bhaumik Patel on 7:30 AM Rating: 5