Gunnar Bittersmann: Grid Anordnung ohne Media Querys ändern je nach device?

Beitrag lesen

problematische Seite

@@Henry

Bei breiterem View also Desktop oder Tablet siehts dann zb. so aus

  • 1 - 2 - 3
  • 1 - 4 - 5
  • usw.

Das ist OK so.

Jetzt die Frage, bei der Handy Darstellung hätte ich gerne:

  • 2
  • 1
  • 3
  • 4
  • usw.

Beim Anordnen von Elementen sollte man achtgeben, dass sich die visuelle Darstellung mit der Reihenfolge im DOM deckt – inbesondere, wenn interaktive Elemente (Links, Buttons, Eingabefelder, …) im Spiel sind. Wenn der Fokus bei Tastaturbedienung wild auf der Seite umherspringt, macht das die Bedienung ziemlich schwierig.

Möglicherweise muss man dazu Inhalte doppelt im DOM haben:

2 (nur sichtbar auf kleinen Viewports), 1, 2 (nur sichtbar auf großen Viewports), 3, 4, 5.

In deinem Fall geht aber vielleicht auch die Reihenfolge 2, 1, 3, 4, 5 im DOM.

Zur Anordnung im Grid ist da sicher ein Media-Query nötig.

Was ist eigentlich zwischen einspaltig und dreispaltig? Gibt’s da noch zweispaltig?

😷 LLAP

--
“When I was 5 years old, my mother always told me that happiness was the key to life. When I went to school, they asked me what I wanted to be when I grew up. I wrote down ‘happy.’ They told me I didn’t understand the assignment, and I told them they didn’t understand life.” —John Lennon