Abstände, Zentrierung, responsive

[Rolf B]

Hallo Walter,

Wie erreiche ich bei breiten Bildschirmen, dass die beiden Texte nebeneinander stehen?

Wenn Du möchtest, dass zwei Elemente per Grid-Layout nebeneinander stehen, muss ihr Elternelement display:grid haben, nicht die Elemente selbst.

Damit das nur bei breiten Bildschirmen passiert, schließe diejenigen Regeln, die das Grid erstellen, in einne @media-Abfrag ein:

@media (width > 50em) {
   body {
      display: grid;
      grid-template-columns: 1fr 1fr;
   }
}

Das ist jetzt auf dein links/rechts-Beispiel gemünzt, in dem die "Links" und "Rechts" Elemente (die gerne gültiges HTML sein möchten, wie Gunnar schrieb) Kindelemente des Body sind.

Vielleicht hilft Dir unser Tutorial-Satz zu Grid weiter:
https://wiki.selfhtml.org/wiki/CSS/Tutorials/Grid

Rolf