Benjamin: Formular: Problem mit Firefox

Hi

Ich habe ein Formular erstellt, das im IE richtig dargestellt wird. Aber der Firefox stellt es irgendwie falsch dar. Er legt ab und zu einfach ein paar Felder übereinander oder so.

Hier ist mein Quelltext:

<input type="text" name="email"><br>
Pizza<br>
</fieldset>
<br>
<fieldset style="width: 334px; height: 54px; padding: 2">
<legend>Pizza</legend>
<select name="pizza">
  <option value="calzone" selected="selected">Pizza Calzone</option>
  <option value="funghi">Pizza Funghi</option>
<option value="hawaii">Pizza Hawaii</option>
<option value="margheritta">Pizza Margherita</option>
<option value="marinara">Pizza Marinara</option>
<option value="napoli">Pizza Napoli</option>
<option value="prosciutto">Pizza Prosciutto</option>
<option value="quatrostaggione">Pizza Quatro Staggione</option>
<option value="vulcano">Pizza Vulcano</option>
</select>
<br>
</fieldset>
<br>
<fieldset style="width: 334px; height: 54px; padding: 2">
<legend>Grösse</legend>
<input type="radio" name="groesse" value="normal"> Normal
<input type="radio" name="groesse" value="extragross"> Extra Gross
<input type="radio" name="groesse" value="gross"> Gross
<input type="radio" name="groesse" value="klein"> Klein
</fieldset>
<br>
<fieldset style="width: 334px; height: 54px; padding: 2">
<legend>Zusatz</legend>
<input type="checkbox" name="ananas" value="ja"> Ananas
&nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" name="pilze" value="ja"> Pilze
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" name="speck" value="ja"> Speck
<input type="checkbox" name="brocoli" value="ja"> Brocoli<br>
<input type="checkbox" name="salami" value="ja"> Salami
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" name="peperoni" value="ja"> Peperoni
<input type="checkbox" name="oliven" value="ja"> Oliven
<input type="checkbox" name="spinat" value="ja"> Spinat<br>
<input type="checkbox" name="parmesan" value="ja"> Parmesan
<input type="checkbox" name="thon" value="ja"> Thon
</fieldset>
<br>
<input type="checkbox" name="bestaetigung" value="ja"checked="checked"> Best&auml;tigung der Bestellung an mich senden
<br><br>
<input type="submit" value="Abschicken" name="Abschicken">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;<input type="reset" value="Zur&uuml;cksetzen">
</form>
</body>
</html>

Vielleicht weiss ja jemand von euch, was da im Quellcode falsch ist. Danke schon im Voraus für die Antworten.

Gruss

  1. Hi,

    Ich habe ein Formular erstellt, das im IE richtig dargestellt wird.

    unwahrscheinlich. Vielleicht wie gewünscht, nicht aber richtig.

    Aber der Firefox stellt es irgendwie falsch dar. Er legt ab und zu einfach ein paar Felder übereinander oder so.

    "Oder so" klingt nach einer eher unvollständigen Problembeschreibung.

    Hier ist mein Quelltext:

    Wesentliche andere Teile der Seite sind relevant - inklusive solcher, die nicht aus Code bestehen. Verlinke bitte die minimalisierte Problemseite.

    <fieldset style="width: 334px; height: 54px; padding: 2">

    Und validiere zunächst den HTML- und CSS-Code. Zumindest letzterer ist defekt.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hi

      Danke für die Antwort. Ich mein mit richtig, meinen Wünschen entsprechend. Ich benutze nämlich nur Firefox und bin kein IE Fan.
      Hier der Link:
      http://www.gbconline.info/info2b_05/zegg/formular_pizza.html

      Gruss

      1. Hallo Benjamin.

        http://www.gbconline.info/info2b_05/zegg/formular_pizza.html--</faq/#Q-19>, Danke.

        Kleiner Tipp zur Usability: Nutze label.

        Gruß, Ashura

        --
        Selfcode: sh:( fo:) ch:? rl:( br:^ n4:& ie:{ mo:) va:) de:> zu:) fl:( ss:| ls:[ js:|
        30 Days to becoming an Opera8 Lover -- Day 16: Sessions
        Meine Browser: Opera 8.0 | Firefox 1.0.4 | Lynx 2.8.3 | Netscape 4.7 | IE 6.0
        IE Layout-Workaround №1: <!--[if IE]><style type="text/css">*{display:none;}</style><![endif]-->
  2. Es liegt an den Einrückungen "&nbsp;". Dise werden in unterschiedlichen
    Systemen (OS und Browser) unterschiedlich dargestellt, bzw. nehmen eine
    andere Größe an.

    Fatal ist dann eine absolute Höhenangebe für das "fieldset".
    Hier verschwinden im ungünstigen Fall Checkboxen.

    Versuche die Checkboxen mit Hilfe von CSS zu positionieren
    oder lass den jeweiligen Browser entscheiden.

    1. Hi,

      Fatal ist dann eine absolute Höhenangebe für das "fieldset".
      Hier verschwinden im ungünstigen Fall Checkboxen.

      nein: im Firefox überlagern sich die Elemente, da er die Höhenangabe im Gegensatz zum IE beachtet und overflow:visible gilt. Und es ist absoluter Unsinn, in eine Box mit height:54px sieben(!) input-Felder untereinander zu setzen und anzunehmen, daß könnte schon irgendwie reinpassen.
      Übrigens wird padding:2 ignoriert und selbst für eine Beispielseite sollten nicht nur Inline-Styles verwendet und Fehler vorher beseitigt werden.

      freundliche Grüße
      Ingo