How can I implement Stack Overflow-like watermarks in forms?

Question

I remember seeing a tutorial somewhere that talks of how to style your input forms in a more “usable” way.

Essentially, you have a placeholder value and when you ent

Answer 1

I wrote this example which I—for lack of a better name—called persistent placeholders.

It requires a little more markup, a div wrapping a label and input, but that solves a lot of other problems (like placeholders getting into your form data or password fields not working) and the actual markup is very clean to read. You end up with something like this:

    Username
    

and after including the CSS and JS, it just works.