2 Tabellen synchronisieren

  • HTML

Es gibt 1 Antwort in diesem Thema. Der letzte Beitrag () ist von Link.

    2 Tabellen synchronisieren

    Hallo,

    folgendes Problem.
    Auf meiner Webseite - ASP.NET MVC 5 - befinden sich zwei Tabellen aus Divs.

    Die erste Tabelle enthält nur den Tabellenkopf mit den Überschriften der Spalten.
    Die zweite Tabelle enthält die Daten, wobei jede Reihe eine eigene HTML-Form ist.
    (Ich brauche für jede Reihe einen eigenen Post wenn der Inhalt bearbeitet wird, deswegen auch die Trennung zwischen Kopf und Inhalt)

    Das Problem besteht nun darin, dass die Tabelle nicht dynamisch die Breite ändern kann ohne das die Zuordnung zwischen Kopf und Inhalt verschoben wird.

    Gelöst hab ich die dynamik so, dass pro Reihe jeweils eine Zelle (Kopf und Inhalt) ohne Breite definiert wurde.
    Enthält diese genug Inhalt (Text) nimmt sie sich den freien Raum einfach.
    Dies klappt - wenn überhaupt - nur bedingt im Inhaltsteil.

    Welche Möglichkeiten gibt es beide Tabellen zu synchronisieren und die ganze Browser Breite auszufüllen.

    Beide Tabellen (Kopf und Inhalt) sehen wie folgt aus.

    HTML-Quellcode

    1. <div class="leisteGrau table stil2">
    2. <div class="tableRow">
    3. <div class="tableCell breite160">
    5. </div>
    6. <div class="tableCell breite160">
    8. </div>
    9. <div class="tableCell">
    10. <!-- Zelle ohne feste Breite, liefert theoretisch die dynamik -->
    11. </div>
    12. <div class="tableCell breite100">
    14. </div>
    15. <div class="tableCell breite100">
    17. </div>
    18. <div class="tableCell breite100">
    20. </div>
    21. </div>
    22. </div>


    Gruss

    mikeb69

    Hi,

    so ganz hab ich ned verstanden was du da vor hast. Aber vielleicht solltest du dir das Grid-Layout von Bootstrap mal anschauen.
    Einfach mal die zwei Links (von hier) in deinen <head> oben rein und mit den cols und rows rumspielen. Siehe getbootstrap.com/examples/grid/

    Link :thumbup:
    Hello World

Facebook
Telefonspende