Textfield-Resize des Browsers steuern

Datum: 5. April 2012
Autor*in: Axel Güldner


Wer hat dieses Textfield-Resize eigentlich eingeführt? War es der Chrome der es das erste mal angeboten hat? War es der Safari? Egal, Apple oder Google, einer von beiden ist mit Sicherheit schuld.

Aber Moment, wovon rede ich da eigentlich? Dem einen oder anderen, vielleicht ja auch jedem, ist evtl. aufgefallen, dass sich Textfields in Formularen mittlerweile in so ziemlich jedem Browser fröhlich groß und klein ziehen lassen. Das ist an sich eine nette Sache, kann der User sich so immerhin ein zu kleines Textfeld passend größer zerren.

Der nicht so schöne Nebeneffekt, wir Designer haben uns was dabei gedacht wenn ein Textfield in einem Formular 500px breit ist und wir mögen es dann gar nicht wenn jeder Webseitennutzer an der Größe rumspielt und uns hinterher ganz clever darauf hinweist, dass die Seite nun auf einmal blöd ausschaut. Na ist doch klar dass die Seite hinterher blöd ausschaut, deswegen war das Textfeld ja ursprünglich nur 500px breit und nicht 1500px – selbst schuld und Feierabend.

Wer jetzt immer noch nicht weiß um was es geht, kann sich ansonsten mal die beiden Screenshoots von Stuttgart anschauen. Einmal wie das Textfeld ursprünglich gedacht war, einmal wie es sich fröhlich vergrößern lässt.

Und jetzt zu dem Teil weswegen Ihr diesen Beitrag lest:

Aber CSS3 gibt uns ein kleines Attribut zur Hand, mit welchem wir die verflixten Textfelder wieder zur Räson bringen können.
Gemeint ist das Attribut »resize« welches »none«, »vertical«, »horizontal« und »inherit« sein kann. Darüber kann man mit wenig Aufwand die Resize Funktion des Browsers auf eine Achse begrenzen oder auch ganz abschalten.

 


Kommentare

Selber kommentieren:






Weitere Beiträge zum Thema Technologie


Netbeans und GIT

Autor*in: Florian Müller


Technologie


Ich habe mich mal während der Arbeit mit Git mit den Git Hooks beschäftigt. Ziel war es, unnötige Builds in der Pipeline zu vermeiden, welche aufgrund von Lintern fehlschlagen. Dazu wollte ich einen Pre-Commit Hook einsetzen. Ein simpler Hook, welcher vor einem Commit ausgeführt werden sollte: Wenn man über die Command line commiten will, wird diese auch …


Beitrag lesen
21
APR
17

Erste Eindrücke von der WJAX2012

Autor*in:


Technologie


Heute gab es im Dev-Meeting schon einige Eindrücke von der diesjährigen WJAX von mir zu hören. Diese Punkte möchte ich nun an dieser Stelle noch einmal kurz zusammenfassen. Neben Rucksäcken, T-Shirts und Kulis gab es auch dieses Jahr im Westin Grand Hotel in München wieder einige spannende Sessions. Vor der Eröffnung der eigentlichen Hauptkonferenz am …


Beitrag lesen
08
NOV
12

Recap Velocity Conference Amsterdam 2016

Autor*in: Robert Klauser


Technologie // Über den Tellerrand


Nach drei spannenden Tagen von 7. bis 9. November 2016 in Amsterdam bin ich mit vielen neuen und interessanten Eindrücken von der Konferenz zurückgekehrt, die ich gerne mit Euch teilen möchte. Bei der Velocity Conference ging es um die Themen Web Performance in allen Facetten sowie DevOps als Prozess für den agilen und performanten Betrieb …


Beitrag lesen
11
NOV
16

JavaScript Days Berlin und online 2022

Autor*in: Magdalena Piller


Technologie // Über den Tellerrand


Ein kurzes Wrap-Up meiner diesjährigen Teilnahme an den JS-und Angular-Days. Leider wurde in diesem Jahr die Konferenz nicht als volle „Hybrid“-Veranstaltung gehalten, so dass nur eine geringe Auswahl an Sessions online zur Verfügung standen. Sehr schade! Trotzdem fanden sich noch einige spannende Themen.


Beitrag lesen
07
NOV
22