Hallo.
Es ist _nicht_ möglich, ein _valides_ xhtml 1.0 strict Formular _ohne_ divs bzw. _ohne_ spans so mit _validem_ CSS zu formatieren, daß Inputfelder, Textareas und vorallem auch der Absendebutton im IE, im Firefox _und_ im Opera _pixelgenau_ gleich breit sind _und_ dabei _nur_ "em" als Breiten- / Längenangabe verwendet werden darf.
Das stimmt so nicht.
Will man dies erreichen, _muss_ man auf divs bzw. spans zurückgreifen.
Folgende Struktur ist valide und funktioniert:
<form action="" method="post">
<fieldset>
<dl>
<dt><label for="sowohl">Sowohl</label></dt>
<dd><input id="sowohl" type="text" /></dd>
<dt><label for="alsauch">Als auch</label></dt>
<dd><textarea id="alsauch" cols="" rows=""></textarea></dd>
</dl>
<button type="submit">Tschüss</button>
</fieldset>
</form>
Doch egal ob mit spans oder divs, ich schaffe es selbst _mit_ genannten Erweiterungen des Quellcodes nicht. :-(
- Wenn du die seitlichen Rahmen um die Eingabe-Elemente weglässt, funktioniert die Formatierung.
- Wenn du die Rahmenstärke der seitlichen Rahmen um die Eingabe-Elemente in ganzzahligen
em
-Werten angibst und kumuliert von der Breite des<dd>
-Elements abziehst, funktioniert die Formatierung. - Wenn du die Rahmenstärke der seitlichen Rahmen um die Eingabe-Elemente in krummen
em
-Werten bestimmter Größe angibst und kumuliert von der Breite des<dd>
-Elements abziehst, funktioniert die Formatierung.
Dass nicht jeder krumme Wert funktioniert, liegt an der unterschiedlichen Berechnungsweise der Browser. Generell gilt, dass Opera und Safari das Pixel-Equivalent desem
-Wertes einmal festlegen, während Firefox bei jedem Vorkommen des Wertes eine neue Berechnung vornimmt. Nun mag man es seltsam finden, dass Firefox immer wieder auf unterschiedliche Ergebnisse trotz gleicher Ausgangswerte kommt, aber dafür ergeben die Werte kumuliert meist eher den Ausgangswert als in Opera oder Safari.
Ein Beispiel:1em
entspreche hier 14 Pixeln,0.1em
folglich 1,4 Pixeln.
In Opera und Safari würden0.1em
stets zu 1 Pixel gerundet, wodurch 10 x0.1em
plötzlich nicht mehr 14 Pixel sind, sondern nur noch 10 Pixel.
In Firefox würde sechs mal0.1em
und vier mal0.2em
herauskommen, womit die 10 x0.1em
in der Summe noch immer 14 Pixeln entsprechen.
Und ich gebs jetzt auf. Sollte jemand eine Lösung wissen, würd es mich glücklich machen, ansonsten hau ich jetzt den Hut drauf.
Verwende einfach durchgängig die richtigen Maßeinheiten und möglichst einfache Werte.
MfG, at