Gunnar Bittersmann: Die Media-Queries bringen mich zum Heulen...

Beitrag lesen

@@MichaelS

Um keine ellenlange und damit unübersichtliche .css- Datei zu bekommen, habe ich zuerst im HTML-Text ( zur Probe nur in der index.htm) drei .css Dateien eingebunden.

Und was ist mit den bei allen Viewportgrößen gemeinsamen Dingen wie Hintergrund, Textfarbe, Schrift, …? Die wiederholst du jeweils? Keine gute Idee.

Übrigens lassen sich mit Grid und Flexbox und minmax, min, max, clamp so manche Layouts auch ohne Breakpoints umsetzen. Beispiele: Bildergalerie, An die Freude

@media (max-width: 600px) {
@media (min-width: 600px) and (max-width: 1370px)  {
@media (min-width: 1370px)  {

Die Breakpoints sind falsch. Bei 600px breitem Viewport gilt sowohl der erste als auch der zweite Block; bei 1370px breitem Viewport gilt sowohl der zweite als auch der dritte Block.

Oft ist es auch keine gute Idee, stacked media queries zu verwenden. ☞ overlapping vs. stacked

Breakpoints sollten nie in px, sondern in em angegeben werden. ☞ PX, EM or REM Media Queries?

😷 LLAP

--
„Dann ist ja auch schrecklich, dass wir in einem Land leben, in dem nicht nur Bildungswillige leben, sondern auch hinreichende Zahlen von Bekloppten. Das darf ich so locker formulieren, ich bin ja jetzt Rentner und muss nicht mehr auf jedes Wort achten.“
— Joachim Gauck über Impfgegner