Struktur einer Homepaage

[Gunnar Bittersmann]

@@Gast

Ich werde mit Deinem Vorschlag

body {
   margin: 0;
   padding: 8px;

Das habe ich nicht vorgeschlagen. Wenn irgendwo im Stylesheet px auftaucht, sehe ich das i.d.R. als Fehler an. Es ist vermutlich nicht die schlechteste Idee, den Randabstand von der Schriftgröße abhängig zu machen, also in em oder rem anzugeben.

   box-sizing: border-box;
   min-height: 100vh;
}
*, ::before, ::after { box-sizing: border-box }

Wenn du box-sizing: border-box für * angibst, solltest du das nicht für body nochmal tun. Mein Vorschlag sähe also so aus:

body {
   margin: 0;
   padding: 0.5em;
   min-height: 100vh;
}

*, ::before, ::after { box-sizing: border-box }

Wobei noch die Reihenfolge der Regeln zu überlegen wäre: vom Speziellen zum Allgemeinen oder andersrum. Wobei zweites wohl sinnvoller ist, da bei gleicher Spezifität die letzte Regel gewinnt. Also:

*, ::before, ::after { box-sizing: border-box }

body {
   margin: 0;
   padding: 0.5em;
   min-height: 100vh;
}

auch wenn mir die :: noch nichts sagen.

: bei Pseudoklassen (:hover, :focus, :invalid, :first-child, …);
:: bei Pseudoelementen (::before, ::first-letter, ::marker, …).

😷 LLAP