Hallo einsiedler, > ~~~CSS, bad > @media all { > header, nav, main, aside, footer, article, figure, figcaption, audio, video { > display: block; > } > *, *:before, *:after { > -moz-box-sizing: border-box; > -webkit-box-sizing: border-box; > box-sizing: border-box; > } > > /* alle weiteren Deklarationen */ > } > ~~~ Einige Hinweise zu deinem CSS unabhängig von deiner Frage. - Es ist nicht notwendig, das gesamte CSS von einer Medienabfrage abhängig zu machen, die sowieso für alle Medien gelten soll. Das ist ungefähr so, als sagtest du: „Kauf mir bitte ein Eis, aber nur wenn heute ein Tag ist“ - Das Vorstellen der unbekannten Elemente machst du hauptsächlich für IE < 8, aber da der keine Mediaqueries kennt, ist es nicht unwahrscheinlich, dass der überhaupt keine CSS-Regel zu Gesicht bekommt. - Browser, die `box-sizing` mit Präfix brauchen, sind ausgestorben. - Pseudoelemente werden mit zwei Doppelpunkten gekennzeichnet, `*::after` ist dasselbe wie `::after` - Es ist nicht sinnvoll, zu versuchen die Seite in allen Browsern gleich aussehen zu lassen. Ebenso ist es vertane Zeit für IE8 ein Grid nachbauen zu wollen. Dein CSS wird also ~~~css *, ::before, ::after { box-sizing: border-box; } ~~~ besser noch ~~~css html { box-sizing: border-box; } *, ::before, ::after { box-sizing: inherit; } ~~~ falls du verschiedene Werte für border-box verwenden möchtest. Unter Berücksichtigung der IE < 13 könnte auch ~~~css html { box-sizing: border-box; } *, ::before, ::after { box-sizing: border-box; box-sizing: inherit; } ~~~ sinnvoll sein, da diese `inherit` nicht kennen. ------ Interessehalber: Warum musst du an allen möglichen und unmöglichen Stellen einen Zeilenumbruch setzen? Bis demnächst Matthias -- Rosen sind rot.

Hallo einsiedler, > ~~~CSS > @media all { > header, nav, main, aside, footer, article, figure, figcaption, audio, video { > display: block; > } > *, *:before, *:after { > -moz-box-sizing: border-box; > -webkit-box-sizing: border-box; > box-sizing: border-box; > } > > /* alle weiteren Deklarationen */ > } > ~~~ Einige Hinweise zu deinem CSS unabhängig von deiner Frage. - Es ist nicht notwendig, das gesamte CSS von einer Medienabfrage abhängig zu machen, die sowieso für alle Medien gelten soll. Das ist ungefähr so, als sagtest du: „Kauf mir bitte ein Eis, aber nur wenn heute ein Tag ist“ - Das Vorstellen der unbekannten Elemente machst du hauptsächlich für IE < 8, aber da der keine Mediaqueries kennt, ist es nicht unwahrscheinlich, dass der überhaupt keine CSS-Regel zu Gesicht bekommt. - Browser, die `box-sizing` mit Präfix brauchen, sind ausgestorben. - Pseudoelemente werden mit zwei Doppelpunkten gekennzeichnet, `*::after` ist dasselbe wie `::after` - Es ist nicht sinnvoll, zu versuchen die Seite in allen Browsern gleich aussehen zu lassen. Ebenso ist es vertane Zeit für IE8 ein Grid nachbauen zu wollen. Dein CSS wird also ~~~css *, ::before, ::after { box-sizing: border-box; } ~~~ besser noch ~~~css html { box-sizing: border-box; } *, ::before, ::after { box-sizing: inherit; } ~~~ falls du verschiedene Werte für border-box verwenden möchtest. Unter Berücksichtigung der IE < 13 könnte auch ~~~css html { box-sizing: border-box; } *, ::before, ::after { box-sizing: border-box; box-sizing: inherit; } ~~~ sinnvoll sein, da diese `inherit` nicht kennen. ------ Interessehalber: Warum musst du an allen möglichen und unmöglichen Stellen einen Zeilenumbruch setzen? Bis demnächst Matthias -- Rosen sind rot.