chicoco: Darstellungsproblem einer Tabelle in Firefox

Hallo Forum,

ich habe folgendes Problem:

Sobald ich diese Angabe: border-collapse:collapse; an meine Tabelle anwende, rutsch diese um 1px nach links, sodass Table-Head und Table-Body nicht mehr bündig  sind. Die Darstellung in IE ist korrekt, aber leider in Firefox nicht. Ihr  könnt euch diesen Fehler hier anschauen: http://scifi.pages.at/chicoco/forum/ff_problem/problem.gif

Quellcode  hier: http://scifi.pages.at/chicoco/forum/ff_problem/ff_problem.html

Im Forum habe ich diesen Beitrag gefunden:  http://forum.de.selfhtml.org/archiv/2005/9/t115181/#m736629 Er hat mir schon weiter geholfen, aber löst nicht ganz mein Problem, da ich unbedingt die Rahmen in Table-Body brauche.

Mit Hintergrundbildern (1x1 Pixel für den Rahmen) habe ich auch versucht zu simulieren, funktioniert hat es schon, aber dann tauchen andere Problemen in anderen Browsers auf.

Wie kann ich dieses Problem lösen?

Ich danke euch sehr im Voraus!

  1. Hallo,

    Sobald ich diese Angabe: border-collapse:collapse; an meine Tabelle anwende, rutsch diese um 1px nach links, sodass Table-Head und Table-Body nicht mehr bündig  sind. Die Darstellung in IE ist korrekt, aber leider in Firefox nicht. Ihr  könnt euch diesen Fehler hier anschauen: http://scifi.pages.at/chicoco/forum/ff_problem/ff_problem.html

    Im Forum habe ich diesen Beitrag gefunden:  http://forum.de.selfhtml.org/archiv/2005/9/t115181/#m736629 Er hat mir schon weiter geholfen, aber löst nicht ganz mein Problem, da ich unbedingt die Rahmen in Table-Body brauche.

    Genau so kannst Du aber um den Bug drumrum arbeiten. Für FireFox und Opera (der macht den Pixel rechts):

      
    table {  
            border-spacing:0;  
            margin:50px auto;  
    }  
      
    td {  
            border:1px solid #000;  
            border-left-style:none;  
            border-top-style:none;  
            padding:0;  
            margin:0;  
            height:30px;  
            text-align:center;  
    }  
      
    td:first-child {  
            border-left-style:solid;  
    }  
      
    th {  
            border:0px;  
            padding:0;  
            margin:0;  
            height:30px;  
    }  
    
    

    Für den IE dann _danach_ folgend:

    <!--[if IE]>
    <style>
    table {
            border-collapse:collapse;
    }

    td {
            border:1px solid #000;
            padding:0;
            margin:0;
            height:30px;
            text-align:center;
    }
    </style>
    <![endif]-->

    viele Grüße

    Axel

    1. Ja SUPER!!! So klappt es prima!

      Vielen Dank Axel!!!

      Chicoco