(please have a look at the pages-source for the source-code)
This first example is fully CSS (no JS).
The only requirement is that the input element must be placed right before the label.
An issue arises when you fill a field that was empty: as you can see the label does not stay above, even by specifying
data-* attributes, forming a "flag" that would tell to CSS if the label should stay at the top. Demo:
And with some textareas: