kulturbanause blog


Hier findest Du Artikel, Tutorials, Downloads, Tipps, Hacks, Snippets und aktuelle Szene-News rund um illustratives Webdesign, Social Media und digitale Bildbearbeitung.



‹textarea›-Größe in Safari und Chrome mit CSS3 erzwingen

textarea-resize

Die Textarea in Safari und Chrome verfügt über einen Anfasser in der unteren rechten Ecke der es dem Seitenbesucher ermöglicht die Größe des Eingabefeldes selbst zu bestimmen.
Eigentlich eine gute Sache, will man doch nicht ganze Aufsätze in ein winziges Textfeld schreiben müssen. Doch häufig zerstört eine manuell vergrößerte textarea das Seitenlayout. Abhilfe kommt wie so oft per CSS3.

Die ‹textarea› mit resize beeinflussen

Die folgenden CSS3 Befehle sollten selbsterklärend sein - mittels resize-Attribut können die Anfasser eines Elements vom Standardwert aus verändert werden. Bei der textarea bedeutet dies, dass die Anfasser (zumindest teilweise) deaktiviert werden können; andere Elemente die im default über keine resize-Funktion verfügen können mit diesem Attribut anschließen per Maus auf die gewünschte Größe aufgezogen werden.

textarea { resize: none;}

textarea { resize: both;}

textarea { resize: vertical;}

textarea { resize: horizontal;}