Größe anpassen Textarea in ein Fluid-Breiten-Layout mit Javascript passen - Javascript, Layout, Textarea, größenverstellbar, flüssig

Ich habe ein fließendes Layout und benötige eine Textfläche zum Vergrößern / Verkleinern, abhängig von der Größe des übergeordneten Containers.

In CSS würde das so aussehen:

textarea{
width: 100%;
}

Dies funktioniert aber nicht mit Textareas.

Wie kann ich das mit Javascript machen? Ich kann die Breite des übergeordneten Elements ermitteln und sie berechnen die Anzahl der Spalten, die zu dieser Breite passen. Woher weiß ich die Größe von 1 Spalte (in Pixel)?

Antworten:

chk das aus: http://css-tricks.com/box-sizing/

  textarea {
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */
}

Es ist 2014 und width: 100%; Jetzt funktioniert mit Textareas in aktuellen Versionen von Chrome, Firefox, IE, Opera und Safari.