Ankündigung

Einklappen
Keine Ankündigung bisher.

Tabelle: rotate(270deg) mit Darstellungsproblemen

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Tabelle: rotate(270deg) mit Darstellungsproblemen

    Hallo zusammen

    ich versuche seit längerem meine Tabelle ordentlich hinzubekommen, scheitere aber an diesem rotate-Befehl. Er rotiert zwar die Wörter richtig, nur werden die Zellen völlig falsch platziert. Alle werden quasi direkt übereinander gepackt und ich kriege das nicht weg.

    Ziel: Ich möchte die Spaltenüberschriften senkrecht zu stehen bekommen und möglichst eng beieinander.

    Hier der Code für die Tabelle:
    PHP-Code:
    echo'<table id="anmeldung">';

    ################################
    # Disziplinen Herren abfragen
    ################################
    $sql_disziplinen 'SELECT fld_id, fld_disziplin FROM tbl_disziplinen WHERE fld_id NOT IN (2) ORDER BY fld_id';
    $result $db->prepare($sql_disziplinen);
    $result->execute();
    $result->bind_result($fld_id$fld_disziplin);
    echo 
    '<caption id="anmeldung">Herren</caption>';
    echo 
    '<tr id="anmeldung">';
    echo 
    '<th id="anmeldung_schulen">Schulen</th>';
    while (
    $result->fetch()) {
        echo 
    '<th id="anmeldung">';
            echo 
    $fld_disziplin;
        echo 
    '</th>';
    }
    echo 
    '</tr>';


    ################################
    # Schulen abfragen
    ################################
    $sql_schule'SELECT fld_id, fld_schule FROM tbl_schulen ORDER BY fld_schule';
    $result_schule $db->prepare($sql_schule);
    $result_schule->execute();
    $result_schule->bind_result($fld_id$fld_schule);
    while (
    $result_schule->fetch()) {
        echo 
    '<tr>';
        echo 
    '<td id="anmeldung_schulen">';
            echo 
    $fld_schule;
        echo 
    '</td>';
        
    ################################
        # Athleten pro Disziplin abfragen
        ################################
        
    $schleife = array(1,3,4,5,6,7,8,9);
        foreach(
    $schleife as $zahl)
        {
            
    $db2 = new mysqli(HOSTUSERPASSWORDDATABASE);
            
    $sql_anzahl"SELECT COUNT(*) as anzahl FROM tbl_wahl as d, tbl_athleten as a 
            WHERE d.tbl_athleten_fld_id = a.fld_id
            AND a.tbl_schulen_fld_id = 
    $fld_id
            AND a.tbl_geschlecht_fld_id = 1
            AND d.tbl_jahr_fld_id = 
    $jahr
            AND d.tbl_disziplinen_fld_id = 
    $zahl";
            
    $result_anzahl $db2->query($sql_anzahl);
            while (
    $row $result_anzahl->fetch_object()) {
                
    $anzahl $row->anzahl;
                echo 
    '<td id="anmeldung">'.$anzahl.'</td>';
            }
        }
        echo 
    '</tr>';
    }
    echo 
    '</table>'
    Und noch der entsprechende CSS:
    Code:
    table#anmeldung {
        table-layout: fixed;
        border-collapse: collapse;
        border-spacing: 6px;
        border: 2px solid;
        margin-bottom: auto;
    }
    
    caption#anmeldung {
        font-size: 1.1em;
        font-weight: bold;
        margin-bottom: 0.5em;
    }
    
    tr#anmeldung {
        width: 20em;
    }
    
    th#anmeldung {
        display: block;
        font-size: 0.8125em;
        -ms-transform: rotate(270deg); /* IE 9 */
        -webkit-transform: rotate(270deg); /* Chrome, Safari, Opera */
        transform: rotate(270deg);
        border: 1px solid;
    }
    
    th#anmeldung_schulen {
        width: 10px;
        border: 1px solid;
        text-align: left;
    }
    
    td#anmeldung {
        width: 50px;
        text-align: center;
    }
    
    td#anmeldung_schulen {
        width: 100em;
        text-align: left;
    }
    Ich danke euch für eure Hilfestellungen!

    Grüsse aus der Schweiz

    Martin


  • #2
    Du solltest statt IDs (die nur einmal pro Dokument vorkommen sollten) Klassen verwenden, und zwar für jeden Elementtyp eine Klasse (nicht element#anmeldung).

    Außerdem solltest du den -webkit--Winkel überprüfen, bei manchen webkit-Winkeln sind die gegenüber dem "normalen" versetzt, kann sein dass das bei transform auch so ist.

    Kommentar

    Lädt...
    X