dedlfix: HTML/CSS: Formulargestaltung

Beitrag lesen

Tach!

Wie gestaltet man am besten ein Formular, gemeint sind hauptsächlich label-input-Paare, das sich möglichst flexibel verhalten soll? Dabei soll „Beschriftung: __________“ immer schön am Doppelpunkt ausgerichtet untereinander stehen. Wie eben in diesem Antwortformular. #7# ganz anders? Wie sind eure Erfahrungen? Was ist best practise draußen im harten Leben des Webentwicklers?

Man kann sich eine Komplett-Lösung an Land ziehen, die nicht nur solche sondern alle möglichen Aspekte der Seitengestaltung schon berücksichtigt hat und obendrein noch responsiv-tauglich ist. Der Platzhirsch ist da wohl Bootstrap. Die generelle Vorgehensweise ist aber auch bei anderen zu finden. Meist wird ein 12er Grid verwendet. Die Beschriftung bekommt 2 oder 3 Spalten, das Eingabefeld die restlichen 10 oder 9. Je nach Größe der Beschriftung können andere Verhältnisse sinnvoll sein. Für schmale Viewports gibt man zusätzlich andere Grid-Klassen, so dass Label und Eingabefeld untereinander zu stehen kommen. (Siehe dort: Bootstrap/CSS Abschnitte Grid und Forms)

dedlfix.