FF verschiebt <td>s

  • [Blockierte Grafik: http://www.picupload.net/files/20042111/1101058877.gif]

    Wie auf diesem Bild schön zu erkennen ist, vreschiebt FF in der letzten Spalte jeweils das letzte <td>-Tag nach rechts verschoben. Das erscheint mir unlogisch und das passiert auch nur im Firefox.
    Es ist nicht die einzigste Tabelle, bei der dieses Problem auftritt und es ist auch nicht immer jede zweite Zeile aber immer die Zelle ganz rechts ...
    Der Code für den Button ist auch immer derselbe, da es per while-Schleife erzeugt wird.
    Kann sich das irgendeiner erklären?

  • <table width="520px" border="1" align="center" >
    <tr>
    <td width="8%"> <center>~</center> </td>
    <td width="25%"><b> ID </b></td>
    <td width="33%"><b> Zeit </b></td>
    <td width="33%"><b> Typ </b></td>
    <td width="8%"> <center>~</center> </td>
    </tr>
    <?

    while($row = mysql_fetch_object($erg))
    {
    $reportid = $row->reportid;
    $type = $row->type;
    $time = $row->time;
    $re = $row->re;
    $time = date("H:i:s",$time);
    switch($type)
    {
    case 1: $type="Reisebericht";break;
    case 2: $type="Reisebericht2";break;
    }
    If($re==0)
    $type="<b>$type</b>";
    ?>


    <tr height="5px">
    <td ><center> <?If($re==0)echo"<b>Neu</b>";else echo"-";?> <center></td>
    <td > <?echo$reportid;?> </td>
    <td > <?echo$time;?> </td>
    <td ><a href="#" onclick="window.open('postfach.php<?echo"?pw=",$pw,"&id=",$id,"&act=showrep&reportid=",$reportid,"";?>' + '','' +'','resizable=yes,scrollbars=yes,menubar=no,toolbar=no,width=650,height=400');" ><?echo$type;?> </a></td>
    <form action="p_frame.php<?echo"?pw=",$pw,"&id=",$id,"";?>" method="POST" target="rechts">
    <td >
    <input type="hidden" value="<?echo$reportid;?>" name="reportid">
    <input type="hidden" value="del" name="act">
    <input type="hidden" value="<?echo$pw;?>" name="pw">
    <input type="hidden" value="<?echo$id;?>" name="id">
    <input type="submit" class="button" value="x" style="width:35px">
    </td>
    </form>
    </tr>



    <?
    }
    ?>
    </table>

    /edit: noch der dazugehörige CSS-Teil

    <style type="text/css">
    <!--
    a:link { text-decoration:none; color:#FFA35F}
    a:visited { text-decoration:none; color:#FFA35F}
    a:hover { text-decoration:none; color:#FF0000}
    a:active { text-decoration:none; color:#E03030}


    body
    {
    background-color:#000000;
    color:#FFA35F;
    background:url(<?echo$pfad;?>background.gif);
    scrollbar-base-color:#000000;
    scrollbar-3dlight-color:#980000;
    scrollbar-arrow-color:#000000;
    scrollbar-darkshadow-color:#111111;
    scrollbar-face-color=980000;
    scrollbar-highlight-color:#FFFFFF;
    scrollbar-shadow-color:#000000;
    scrollbar-track-color:#000000;
    }

    table
    {
    border-width:1px;
    border-color:#E03030;
    border-style:solid;
    padding:0px;
    background:url(<?echo$pfad;?>background.gif);
    background-color:#000000;
    color:#FFA35F;
    }

    td
    {
    border-width:1px;
    border-color:#E03030;
    border-style:solid;
    padding:2px;
    margin:0px;
    color:#FFA35F;
    background:url(pics/design/bgmaptable.gif);
    background-color:#000000;
    text-align:center
    }

    tr
    {
    border-width:1px;
    border-color:#E03030;
    border-style:solid;
    padding:0px;
    color:#FFA35F
    }

    .button
    {
    background-color:#800000;
    color:#FFAA00;
    border:2px solid #DF1818;
    font-weight:bold
    }

    .button:hover
    {
    background-color:#480000;
    color:#FFAA00;
    border:2px solid #DF1818;
    font-weight:bold
    }
    -->
    </style>

  • so wie es jetzt ist nicht, nein - aber ich kann versuchen, den code auf das wesentliche zu beschränken:

    <table width="520px" border="1" align="center" >
    <tr>
    <td width="8%"> <center>~</center> </td>
    <td width="25%"> ID </td>
    <td width="33%"> Zeit </td>
    <td width="33%"> Typ </td>
    <td width="8%"> <center>~</center> </td>
    </tr>

    <tr height="5px">
    <td > </td>
    <td > </td>
    <td > </td>
    <td > </td>
    <form action="p_frame.php" method="POST" target="rechts">
    <td >
    <input type="hidden" value="<?echo$reportid;?>" name="reportid">
    <input type="hidden" value="del" name="act">
    <input type="hidden" value="<?echo$pw;?>" name="pw">
    <input type="hidden" value="<?echo$id;?>" name="id">
    <input type="submit" class="button" value="x" style="width:35px">
    </td>
    </form>
    </tr>

    </table>

    Denn der Fehler tritt nur bei Buttons auf. Noch etwas ziemlich komisches: wenn ich von der Seite aus auf einen anderen Link klicke und dann per History zurückgehe, ist der Fehler behoben :shock:

  • 8% + 25% + 33% + 33% + 8% = 107% ... fängst ja gut an. *g*

    Des weiteren hast Du sehr viele (überflüssige) Leerzeichen drin, die Dir leicht zum Verhängnis werden können.

    Und den <form>-Tag zwischen <tr> und <td> einzureihen ist auch unschön.

    Verpass dem <form>-Tag im style-bereich margin:0px; und padding:0px; dann kannst du es auch problemlos innerhalb eines <td>-Bereiches benutzen, ohne das ungewollte abstände entstehen.

    Versuche solche Leerzeichen zu unterlassen. Leerzeichen sind nämlich auch "Inhalt". Das die Browser den teilweise nicht darstellen liegt an Fehlerkorrektur.

    Schreib lieber so:

    Code
    <tr>
     <td></td>
     <td></td>
     <td></td>
     <td></td>
     <td><form action="p_frame.php" method="POST" target="rechts"><input type="hidden" value="<?echo$reportid;?>" name="reportid"><input type="hidden" value="del" name="act"><input type="hidden" value="<?echo$pw;?>" name="pw"><input type="hidden" value="<?echo$id;?>" name="id"><input type="submit" class="button" value="x" style="width:35px"></form></td>
    </tr>

    Durch die Vermeidung der Leerzeichen wird das ganze sicher sauber laufen. Bin ich mir sehr sicher mit. Viel Erfolg.

  • >>>Verpass dem <form>-Tag im style-bereich margin:0px; und padding:0px; dann kannst du es auch problemlos innerhalb eines <td>-Bereiches benutzen, ohne das ungewollte abstände entstehen.


    Genial, danke, da wollte ich schon immer wissen, wie sich das vermeiden lässt, herrlich :D

    Zu den Leerzeichen: hm, ich probier's mal aber ich hab sie ganz gern der Übersicht halber drin. Na ich probier mal ein wenig mit deinen Tips herum. War auf jeden Fall schon sehr hilfreich !

  • *hinterherspionier*

    Ohne die Leerzeichen scheint es ja gut zu laufen. ; )

    Ordnung ist völlig ok... aber man muss auch aufpassen, ob man bei den Leerzeichen ordnung hat.

    Code
    <td> <img src=""> </td>


    und

    Code
    <td><img src=""></td>


    werden halt unterschiedlich dargestellt. Leerzeichen sind auch dargestellte Zeichen. Behandel sie gut und sie sind gut zu Dir. ; )