Author: | tonystar |
---|---|
Views Total: | 2,771 views |
Official Page: | Go to website |
Last Update: | May 12, 2017 |
License: | MIT |
Preview:

Description:
Yet another pure CSS implementation of the ‘Float Label pattern that floats the label up above the form field when the user starts entering a value.
Installation:
$ npm install float-label-css
How to use it:
Import the float-label-css to your project or include the stylehsheet float-label.css into the document as follow:
<link rel="stylesheet" href="dist/float-label.css"/>
Wrap the form fields and labels into a container named ‘has-float-label’ as follows:
<div class="has-float-label"> <input id="first" type="text" placeholder="Name"/> <label for="first">First</label> </div> <div class="has-float-label"> <input id="last" type="text" placeholder="Surname"/> <label for="last">Last</label> </div>
Nice work