Tabelle über Tabelle

  • Tabelle über Tabelle

    Hi!
    Ich möchte eine Tabelle über einer Tabelle zeichnen. Leider sind die Zellen der zweiten Tabelle, je weiter hinten sie sind, irgendwie stark nach links versetzt. Ich habe insgesamt 19 Zellen, bei der 2. Tabelle ist die 19. Zelle schon so stark versetzt, dass sie ungefähr auf der gleichen Position der 18. Zelle der ersten Tabelle ist, füge ich dann noch eine Zelle der Klasse "none" an, schießt das Ganze übers Ziel hinaus. Die ersten paar Zellen passen zudem leider genau, haben also die korrekte Position. Ich weiß nicht, wo der Fehler ist, ich nutze die Klasse "none" schließlich auch in Tabelle 1, wo alles einwandfrei funktioniert.

    Quellcode

    1. //CSS
    2. .foo
    3. {
    4. width:64px;
    5. height:72px;
    6. }
    7. .none
    8. {
    9. width:64px;
    10. height:72px;
    11. min-width:64px;
    12. max-width:64px;
    13. min-height:72px;
    14. max-height:72px;
    15. display:inline-block;
    16. padding:0px;
    17. }
    Alles anzeigen

    HTML-Quellcode

    1. //HTML
    2. <table style="z-index:0;position:absolute;">
    3. <td><div class="foo">12</div></td>
    4. <td><div class="none"></div></td>
    5. </table>
    6. <table style="z-index:1;position:absolute;">
    7. <td><div class="none"></div></td>
    8. <td><div class="none"></div></td>
    9. </table>


    Weiß jemand Rat? :S

  • Mal so pie mal Daumen gesagt, was mir nicht so 100%-ig bei dir gemacht zu sein scheint:
    Gib den Zeilen einfach feste höhen:

    Quellcode

    1. <table>
    2. <tr id="1"><td>Text</td></tr>
    3. <tr id="1"><td>Text</td><tr>
    4. </table>
    6. <table>
    7. <tr id="1"><td>Text</td></tr>
    8. <tr id="1"><td>Text</td></tr>
    9. </table>


    Quellcode

    1. #1 {
    2. height:50px;
    3. }
    5. oder
    7. .tr {
    8. height:50px;
    9. }
    10. (Galube aber der Punkt ist das flasche, oder? Weiß ich rgad nicht mehr, sorry.)


    Hoffe, ist verständlich was ich meine.. meiner Denkweise nach müsste das so funktionieren.

  • Versuch mal die boxen auf einen festen wert zu setzten also überprüfen, ob margin, padding, border,... die selben Werte haben. Sieht für mich ganz nach einem Rechenungsfehler aus. Wenn du mit height und widht arbeitest, braucht es keine min/max werte.
    Eine Frage zu deinem Code: Sollen die Zellen einer Tabelle alle neben einander aufgelistet werden? Wenn ja, wär ein float: left vlt mal eine Idee... Allerdings bin ich mir über den support bei <td> nicht sicher. Attribute wie height und co werden in html 5 bei <td> nicht mehr supportet aber mit einem div im element sollte es klappen.