HelloSign: Everything IT requires and Developers love
In desktop Safari, Chrome, Firefox, and Opera-under-Presto, (not IE, not mobile anything) <textarea>s have a little resizer nugget in the bottom right corner. Textareas are for writing in, so if users need more space to feel more comfortable writing in there, they can have it. Clicking and dragging that resizer literally changes the box model of that textarea, pushing other things away as needed. We can use that little ability to make a trick!
Fair is fair, I didn't invent this. I saw it maybe a year ago but I can't for the life of me remember where. When I saw David Walsh's quick post on how you can style it, it reminded me of this, so I set about recreating the idea.
Let's say you put that <textarea> in a green <div>.
Then you drag that <textarea> taller. The <div> gets bigger.
Now say we absolutely positioned that
at the bottom of another area.
Now as you drag the textarea resizer downward to grow it larger, the div actually grows upwards.
Then if we make the textarea small and style the resizer handle, it doesn't looks like a textarea at all (webkit only).