Responsive Tabelle

Wie passe ich mein Layout für verschiedene Ausgabegeräte mit @MEDIA an?

Am Beispiel einer Tabelle kann man sehr gut den Unterschied zwischen Desktop Ansicht und Smartphone darstellen. Im wesentlichen wird das Ein- und Ausblenden über geänderte DISPLAY Werte erreicht. Natürlich ist die technische Ebene nur eine Seite der Medaille. Man muss in der mobilen Ansicht andere Schwerpunkte setzen. Auf dem Smartphone ist scrollen von oben nach unten ein typischer Vorgang und demnach müssen mit @MEDIA die Elemente untereinander angeordnet werden. Bei einigen Elementen ist es z.B. besser den Tabellenkopf zu wiederholen. Als praktisch erweisen sich dafür PSEUDO-ELEMENTE mit Bezug auf HTML Attribute.

Arnold-Bode-Schule
Berufliche Schule der Stadt Kassel
Kontakt | Impressum | Datenschutz