Jonas: <form...> tag fügt bei Opera "Leerzeilen" ein

Hallo

Ok, habe folgendes Problem:
Ich füge in eine Tabelle ein normales html-Formular ein. Das Ganze sieht etwa so aus:

...
<tr>
<form method="post" name="tloginform" action="test.php">
<td width="115" align="left" valign="middle"><input name="username" type="text" class="topform" id="username" value="username" onfocus="javascript:if(this.value=='username') {this.value='';}"></td>
<td width="115" align="left" valign="middle"><input name="passwrd" type="password" class="topform" id="passwrd" value="password" onfocus="javascript:if(this.value=='password') {this.value='';}"></td>
<td width="59" align="left" valign="middle"><div class="topformbutton" style="width:44px;" onMouseOver="this.style.cursor='hand';" onMouseDown="javascript:document.tloginform.submit()">Login</div></td>
</form>
</tr>
...

Die styles sind allein für die Farbgebung zuständig und sollten deshalb nicht das Problem sein.

Nun ist es so, dass wenn ich das Ganze im IE oder Mozilla Firefox betrachte, alles Tip-Top ausschaut. Leider aber nicht so im aktuellen Opera.
Die Table-Row wird etwa doppelt so hoch, als würde oberhalb des Formulars noch eine Leerzeile gleicher Höhe stehen. Da ich die Seite eigentlich gerne auf allen Browser plus minus gleich aussehen lassen möchte, bleibt mir nur die Lösung, euch zu fragen :D

Wo liegt das Problem? Und vielmehr: Was kann man dagegeb tun?

Grüsse und Dank

Jonas

  1. Hello out there!

    Ich füge in eine Tabelle ein normales html-Formular ein.

    1. Nein, genaugenommen tust du nicht.
    2. Genaugenommen geht das auch nicht.

    <tr>
    <form method="post" name="tloginform" action="test.php">

    Fehler: form darf kein Kind von tr sein.
    Was Browser aus invalidem Quelltext machen, ist jenseits jeglicher Spekulation.
    Der [http://validator.w3.org] hilft dir bei der Berichtigung.

    See ya up the road,
    Gunnar

    --
    “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
    1. Hi

      Ok, danke. Aber wie kriege ich dann regelgerrecht zwei verschiedene Formulare in eine Tabellenzeile?

      Gruss

      Jonas

      1. Hallo Jonas,

        Aber wie kriege ich dann regelgerrecht zwei verschiedene Formulare in eine Tabellenzeile?

        wo liegt da das Problem?
        Sinngemäß:

        ~~~html <table>
          <tr>
           <td>
            <form>
            erstes Formular
            </form>
            <form>
            erstes Formular
            </form>
           </td>
          </tr>
         </table>

          
        Viel intensiver würde ich aber hinterfragen, warum die Formulare überhaupt in eine Tabelle gesperrt werden müssen.  
          
        So long,  
         Martin  
        
        -- 
        Frauen sind wie Elektrizität: Fasst man sie an, kriegt man eine gewischt.
        
        1. Nun ja, das ist klar, so klappt das schon regelgerecht.
          ABER:
          Die einzelnen Felder sollten wiederum durch Tabellenzellen getrennt werden.

          Die Formulare müssen in eine Tabelle gesperrt werden, da ich drei Eingabefelder nebeneinander haben will pro Formular und diese Felder genau 6 pixel Abstand halten müssen. Da kommt mir ehrlich gesagt nur die Möglichkeit in den Sinn, die einzelnen Felder mittels Tabellenspalten zu trennen.

          Gruss

          Jonas

          1. Hi,

            Die Formulare müssen in eine Tabelle gesperrt werden, da ich drei Eingabefelder nebeneinander haben will pro Formular und diese Felder genau 6 pixel Abstand halten müssen.

            Ja und? input{margin-right:6px;}

            freundliche Grüße
            Ingo

        2. Hmm...
          Wenn ich das Layout verändere und die Sache nach diesem Muster mache, sieht das Ganze in Opera zwar korrekt aus, im IE habe ich dann aber UNTER den Eingabefeldern eine Leerzeile :(

          <table>

          <tr>
             <td>
              <form>
              erstes Formular
              </form>
              <form>
              erstes Formular
              </form>
             </td>
            </tr>
          </table>

            
          Also, es ist schon immer wieder schön, mit den verschiedenen Browsern. Oder mache ich da komplett was falsch...  
            
          Gruss  
            
          Jonas
          
          1. Hallo,

            Wenn ich das Layout verändere und die Sache nach diesem Muster mache, sieht das Ganze in Opera zwar korrekt aus, im IE habe ich dann aber UNTER den Eingabefeldern eine Leerzeile :(

            Was meinst du mit "unter den Eingabefeldern"? Nach dem </form>? Das wäre normal, weil form ein Blockelement ist. Durch das browserinterne Default-Stylesheet wird es wohl Randabstände nach oben und/oder nach unten bekommen. Wenn du willst, dass diese Abstände in allen Browsern gleich sind, solltest du sie in deinem Stylesheet explizit angeben.

            Also, es ist schon immer wieder schön, mit den verschiedenen Browsern. Oder mache ich da komplett was falsch...

            Mir schwant da gerade was: Du versuchst nicht womöglich, das Formular über mehrere Zellen zu verteilen, so nach folgendem Muster?

            <td>
              <form>
              ...
             </td>
             <td>
              Eingabefelder
             </td>
             <td>
              ...
              </form>
             </td>

            Das ist nämlich nicht zulässig. Start- und Endtag eines Elements müssen im gleichen Knoten des Elementbaums stehen!

            Schönen Tag noch,
             Martin

            --
            Der Alptraum jedes Computers:
            "Mir war, als hätte ich gerade eine 2 gesehen."
            1. Mir schwant da gerade was: Du versuchst nicht womöglich, das Formular über mehrere Zellen zu verteilen, so nach folgendem Muster?

              <td>
                <form>
                ...
              </td>
              <td>
                Eingabefelder
              </td>
              <td>
                ...
                </form>
              </td>

              Das ist nämlich nicht zulässig. Start- und Endtag eines Elements müssen im gleichen Knoten des Elementbaums stehen!

              Hi

              Doch, genau das war mein Ziel - aber in dem Fall muss ich das irgenwie anderst lösen, oder?

              Gruss und Dank

              Jonas

              1. HAHA ok, habe die Lösung gefunden!

                form {

                padding: 0px;
                 margin: 0px;
                }

                Dann noch die <form> tags in die richtige sektion des quelltextes und es scheint zu klappen...

                Danke an alle für die Hilfe!

                Gruss

                Jonas