Gustav Gans: Ist ein Tabellenlayout für ein Formular legitim?

Hallo Forumsgemeinde,

bei der Erstellung eines validen xhtml 1.0 Formulars, bei dem die Labels und die Inptfelder nebeneinander liegen und die exakt selben Werte bei Abstand, Höhe, Schriftgröße, Positionierung der Schrift im Feld, etc. haben sollen, stößt man mit CSS an die Grenzen. Vorallem, wenn das Formular in allen gängigen Browsern gleich aussehen soll. Egal, wie man sich mit paddings, margins, line-hights oder floats auch spielt, es kommt immer entweder zu Abweichungen zwischen Label und Inputfeld pro Browser oder zwischen den Browsern.

Die einfachste Lösung wäre die Verwendung einer unsichtbaren Tabelle, in deren Felder ich die Labels und die Inputfelder lege.

Meine Frage an Euch: Ist das legitim und kann ich das ruhigen Gewissens so machen - oder ist diese Lösung genauso verpönt, als ob ich mit Hilfe einer Tabelle ein Spaltenlayout verwirkliche?

MfG

Gustav Gans

  1. Lieber Gustav Gans,

    Tabellenlayouts sind grundsätzlich rassistisch, reine CSS-basierte Layouts dagegen politisch korrekt.

    Wenn Deine Textinputs alle dieselbe Länge haben, dann kannst Du das Ganze ja rechtsbündig ausrichten. Die Labels können dann in ihrer Länge variieren und trotzdem sieht es vernünftig aus. Mein Login-Formular geht z.B. diesen Weg.

    Liebe Grüße,

    Felix Riesterer.

    --
    ie:% br:> fl:| va:) ls:[ fo:) rl:| n4:? de:> ss:| ch:? js:) mo:} zu:)
  2. Hi,

    wofür sind denn Tabellen da?
    Um Daten tabellarisch auszugeben.

    Warum also nicht auch Daten tabellarisch eingeben?

    Das ist meines Erachtens korrekt. Ein Eingabeformular mit Beschriftungen ist sehr gut für eine Tabelle geeignet.

    Name.......Input-Name
    Vorname....Input-Vorname
    Straße.....Input-Straße

    Grüße

    • Steffen
  3. Vorallem, wenn das Formular in allen gängigen Browsern gleich aussehen soll.

    Warum muss oder soll das so sein?
    Ich behaupte dass es völlig unmöglich ist, allein aufgrund von Display-Größen, Default-Styles, die sich der Benutzer mal eingerichtet hat oder CSS, welches er einfach abschaltet.
    Darüber hinaus behaupte ich, dass es auch mit Tabellen unmöglich ist, weil unterschiedliche "geläufige" Browser bei mir z.B. unterschiedliche Schriftarten wählen, weil jeder seine eigenen UI-Elemente hat etc. mag sein dass du die Abstände identisch hin bekommst mit der Tabelle, aber gleich sieht es dann auch noch nicht aus.
    Davon ab dass es eben nicht möglich sein dürfte frage ich mich woher dieser Anspruch kommt. Ich verwende zuweilen sogar unterschiedliche Browser _damit_ es unterschiedlich aussieht. Und genau das willst du nun verhindern...

    Naja all das ist allerdings auch abhängig davon was man unter "gängiger Browser" versteht, wenn das NUR Geckos sind mag es klappen, wenn da der BlackBerry-Browser eingeschlossen ist wird's hart.

  4. Hi there,

    Meine Frage an Euch: Ist das legitim [...]

    Du weisst schon, daß das Wort legitim etwas mit Gesetz und so zu tun hat? Offenbar verblödet man komplett, wenn man länger hier in diesem Forum mitliest...

    1. Hallo,

      Meine Frage an Euch: Ist das legitim [...]
      Du weisst schon, daß das Wort legitim etwas mit Gesetz und so zu tun hat?

      das ist zwar streng nach der Wortherkunft (lat. "lex": das Gesetz) richtig.
      Allerdings ist es heutzutage durchaus üblich, dass "legitim" auch in dem Sinne gebraucht wird, dass etwas einer anerkannten technischen oder auch gesellschaftlichen Norm, einer Konvention entspricht. Das muss nicht unbedingt ein Gesetz sein. So streng nimmt den Ausdruck heute wohl niemand mehr.

      Offenbar verblödet man komplett, wenn man länger hier in diesem Forum mitliest...

      In dem Punkt unterscheidet sich dieses Forum nicht von zahlreichen anderen.

      So long,
       Martin

      --
      Um die Wahrheit zu erfahren, muss man den Menschen widersprechen.
        (George Bernhard Shaw)
      Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
      1. Hi there,

        Offenbar verblödet man komplett, wenn man länger hier in diesem Forum mitliest...

        In dem Punkt unterscheidet sich dieses Forum nicht von zahlreichen anderen.

        So ist es. Ich will mich da als längst Geschädigter auch nicht ausnehmen...

    2. Hi,

      Du weisst schon, daß das Wort legitim etwas mit Gesetz und so zu tun hat?

      Du weißt schon, dass ein Wort mehr als eine Bedeutung haben kann?

      http://de.wiktionary.org/wiki/legitim
      [3] allgemein anerkannt, unbestritten, berechtigt

      Offenbar verblödet man komplett, wenn man länger hier in diesem Forum mitliest...

      Du könntest auch einfach fachlich was beitragen, anstatt dich so an einer Wortwahl aufzuhängen ...

      MfG ChrisB

      --
      RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
      1. Hi there,

        Du könntest auch einfach fachlich was beitragen, anstatt dich so an einer Wortwahl aufzuhängen ...

        Es geht nicht um die Wortwahl sondern um die Konsquenz der offensichtlich erfolgten Gehirnwäsche. Zu fragen, ob man Tabellen verwenden darf, um ein Formular zu gliedern, ist schon ziemlich absurd, findest Du nicht?

        1. Hi,

          Es geht nicht um die Wortwahl sondern um die Konsquenz der offensichtlich erfolgten Gehirnwäsche. Zu fragen, ob man Tabellen verwenden darf, um ein Formular zu gliedern, ist schon ziemlich absurd, findest Du nicht?

          Und die Frage in die Richtung zu deuten, dass man die Nutzung einer Tabelle zu diesem Zweck und mögliche Alternativen, sowie deren jeweilige Vor- und Nachteile mal betrachtet, erscheint dir nicht ggf. fachlich sinnvoller, als etwas von „Gehirnwäsche“ zu faseln? ;-)

          MfG ChrisB

          --
          RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
          1. Hi there,

            Und die Frage in die Richtung zu deuten, dass man die Nutzung einer Tabelle zu diesem Zweck und mögliche Alternativen, sowie deren jeweilige Vor- und Nachteile mal betrachtet, erscheint dir nicht ggf. fachlich sinnvoller, als etwas von „Gehirnwäsche“ zu faseln? ;-)

            Schon, aber der OP ersuchte ja um Auskunft bzgüglich Legitimität seines Vorhabens. Und da war mein erster Gedanke einfach: Werd' erwachsen, frag' nicht so viel und mach es einfach!
            Naja, lassen wir's gut sein, in einem anderen Punkt muss ich Dir natürlich Recht geben; der Nihilismus ist mir echt zur Frohnatur geworden...;)

        2. Zu fragen, ob man Tabellen verwenden darf, um ein Formular zu gliedern, ist schon ziemlich absurd, findest Du nicht?

          »Absurd« ist etwas anderes als eine harmlose technische Frage aus der HTML/CSS-Thematik. Es gibt viele Methoden, ein Formular auszuzeichnen, Tabellen sind nicht immer zweckgemäßes Markup. Ob man das »darf«, ist natürlich nicht die Frage – wer sollte es verbieten –, sondern ob es sich praktisch als nachteilig erweist für (Um-)Formatierung, Wartbarkeit und Ausbaubarkeit.

          Mathias

      2. Was ich noch sagen wollte:

        Du könntest auch einfach fachlich was beitragen, anstatt dich so an einer Wortwahl aufzuhängen ...

        Das war mein fachlicher Beitrag...

        1. Hi,

          Das war mein fachlicher Beitrag...

          Ach so, Klawischnigg'scher Nihilismus mal wieder.

          MfG ChrisB

          --
          RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
  5. bei der Erstellung eines validen xhtml 1.0 Formulars, bei dem die Labels und die Inptfelder nebeneinander liegen und die exakt selben Werte bei Abstand, Höhe, Schriftgröße, Positionierung der Schrift im Feld, etc. haben sollen, stößt man mit CSS an die Grenzen.

    Was meinst du genau? Zeige mal ein Beispiel.

    Egal, wie man sich mit paddings, margins, line-hights oder floats auch spielt, es kommt immer entweder zu Abweichungen zwischen Label und Inputfeld pro Browser oder zwischen den Browsern.

    Meinst du die vertikale Positionierung?

    Die einfachste Lösung wäre die Verwendung einer unsichtbaren Tabelle, in deren Felder ich die Labels und die Inputfelder lege.

    Welchen Vorteil hast du mit der Tabelle? Dass du bei fester Zellenhöhe den Inhalt vertikal mittig positionieren kannst?
    Davon abgesehen verhält sich eine Tabellenzelle genauso wie andere Elemente, was die Positionierung seiner Inhalte angeht. Man muss bei Eingabefeldern beispielsweise genauso beachten, dass sie standardmäßig auf der Grundlinie liegen, und bspw. mit vertical-align: middle oder display: block arbeiten.

    Meine Frage an Euch: Ist das legitim und kann ich das ruhigen Gewissens so machen - oder ist diese Lösung genauso verpönt, als ob ich mit Hilfe einer Tabelle ein Spaltenlayout verwirkliche?

    Eine Tabelle für ein Formular kann genauso problematisch sein wie für andere Layoutanwendungen. In der Regel reichen einfachere Strukturen aus, die sich mit CSS flexibler formatieren lassen. Braucht man es komplexer, so kommt man ohnehin an eine Elementhierarchie, die der einer Tabelle gleicht (tr-th(label)-td(input)). Mit sovielen gruppierenden Elementen hat man eine große Freiheit hinsichtlich der möglichen Formatierungen, einschließlich Tabellen-ähnlichem Verhalten. Mit einer Tabelle im Markup legt man sich stärker fest, dafür lassen sich Spalten und Ausrichtung flexibler und robuster lösen – wenn man dieses Layout denn braucht.

    Wenn ich einen Formularbaukasten zusammenstelle, dann meist ohne Tabellen. Was nicht ausschließt, dass manche Formulare Tabellen zumindest teilweise verwenden können. Positionierungsprobleme lassen sich i.d.R. mit CSS lösen.

    Mathias

    1. @@molily:

      nuqneH

      Was nicht ausschließt, dass manche Formulare Tabellen zumindest teilweise verwenden können.

      Ich sehe kein (semantisches) Problem darin, Key-Value-Zuordnungen oder wie hier Label-Eingabefeld-Zuordnungen per Tabelle (th/td) auszuzeichnen.

      Manche schwären da auf Definitionslisten (dt/dd), wobei deren Semantik da manchmal ganz schön gestreckt wird.

      Positionierungsprobleme lassen sich i.d.R. mit CSS lösen.

      Das meinte der große Diktator auch mal und wischte die Idee der Einführung des gruppierenden di-Elements vom Tisch. Unrecht hat er, ohne di lassen sich nicht alle Layoutvorstellungen von Definitionslisten umsetzen.

      Ich hab bei Formularen* schon etliche Definitionslisten in Tabellen umgeschrieben, um das gewünschte Layout browserübergreifend hinzubekommen.

      Qapla'

      * per Script generierte: nicht immer alle Felder da, unterschiedlich viel Inhalt, …

      --
      Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
      (Mark Twain)