[CSS] Objeto elástico

Quando você aplica este css ao img:

img {
    max-width: 100%;
    height: auto;
}

em seguida, ele restringirá sua proporção e redimensionará normalmente, mas e outras tags, por exemplo, vídeo ou textarea? altura: automático; não funcionará para outros objetos além de img, mas há um bom método para obter um efeito semelhante:

HTML:

<div>
    <textarea name=""></textarea>
</div>

CSS:

/* figure */.elastic-object {
    height: 0;
    width: 100%;
    position: relative;
    padding-bottom: 56.25%; /* = 9 * 100/16 = 16:9 */
}

.elastic-object > * {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute;
}

Demo: http://jsfiddle.net/tzaCD/

Isso é baseado neste ótimo artigo