Tabellen Responsive

[Norbert001]

Hallo,

ich habe hier https://vorschau.wagyu-genetics.de/
bei NEWS eine Tabelle mit reponsive CSS.

Bei responsive ist im Moment folgendes

Überschrift
Überschrift
Überschrift
Überschrift

Text
Text
Text
Text

Link
Link
Link
Link

Hätte aber gerne,

Überschrift
Text
Link

bei allen, ich bekomme das einfach nicht hin.
Würde mir bitte jemand zur Seite stehen und mir Helfen.
Danke

[dazzle89]

Liegt daran, dass es CSS-Anweisungen gibt, die die Tabellenzellen mittels Media Query (unter 700px) auf 100% Breite setzen. Diese und viele weitere Definitionen des Media Queries können vermutlich entfernt werden und dann könnte man die Tabelle z.B. mit "overflow-x: scroll" reponsive machen.

[spacefront]

Hallo,

ich habe so etwas mal über Jquerry gelöst. Macht aus der Tabelle eine Liste.
Du musst halt noch die Classen anpassen - oder es gilt für alle Tabellen.

$(document).ready(function() {
    var ul = $("<ul>");
    $(".DEINEKLASSE tbody tr").each(function(){
        var li = $("<li>")
        $("th, td", this).each(function(){
            var p = $("<p>").html(this.innerHTML);
            li.append(p);
        });
        ul.append(li);
    })    
    $(".referenzen tbody").replaceWith(ul);    
});

Oder hier, dann setzt es bei Tabellen ein div drum rum das man dann mit css scrolbar machen kann (overflow-x: scroll)

$(document).ready(function() {
    $(".produktbox:nth-child(2n)").addClass("zweites"); 
});

Viele Grüße

Alex