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


OOP 2014

Autor*in:


Projekte // Technologie // Über den Tellerrand


Auf geht’s zu Tag 2 auf der OOP in München. Dieses Jahr steht die Konferenz unter dem Motto: Complexity – Managing Today’s Challenges. Und dieses Leitthema wurde gestern in zwei Keynotes von Tim Mattson (Intel Corp.) und Glenda Eoyang (Human System Dynamics Institute) bereits in seinen vielschichtigen Facetten aufgegriffen. Die Quintessenz: Komplexität (in IT-Projekten) lässt …


Beitrag lesen
05
FEB
14

HTML5 Polyfill

Autor*in: Sascha Nützel


Technologie


Nachdem das „required“- Attribut im Safari nicht funktioniert, bin ich auf die Suche nach einem Polyfill gegangen. Dabei bin ich auf folgende Bibliothek gestoßen: https://github.com/aFarkas/webshim Die Einbindung gestaltet sich recht simpel und wird hier https://github.com/aFarkas/webshim#installation-and-usage gut erklärt. Es besteht auch die Möglichkeit, nicht alle Module einzubinden sondern nur vereinzelt gebrauchte (z.B. ‚forms‘). Das Portalseitige Minify muss für …


Beitrag lesen
31
AUG
16

Grunt concurrent und time-grunt

Autor*in: Florian Müller


Technologie


Gestern Abend bin ich auf einen Artikel gestoßen, welcher sich mit der Optimierung von Grunt Tasks beschäftigt hat. Vieles davon ist schon im Einsatz, aber eins hat dann doch noch gefehlt – die Parallelisierung. Dies habe ich heute morgen testweise bei einem Projekt integriert. Um vergleichbare Ergebnisse zu bekommen, welche unabhängig von anderen Build Tasks des …


Beitrag lesen
29
SEP
16