2-Spaltenlayout mit einigen Linien

[Matthias Scharwies]

Servus!

was ich will:

• ich mache eine Übersicht über das Thema: ich schreibe eine Mail
• in der linken Spalte stehen die Schritte für unverschlüsselte Mails
• in der rechten Spalte stehen die Schritte für verschlüsselte Mails
• dies alles sind Hardcopies
• dazwischen gibt es auch Textzeilen

Oh, das ist keine Tabelle, sondern ein 2-Spaltenlayout:

<header>
  <h1>Mails schreiben</h1>
  ...
</header>
<section>
  <h1>unverschlüsselte Mails</h1>
</section>
<section>
  <h1>verschlüsselte Mails</h1>
</section>

Das kannst du mit CSS stylen:

body {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

header {
  grid-column: span 2;
}

Besser wäre es, die 2-Spaltigkeit mit media queries aber erst ab einer gewissen Breite einzurichten, da diese auf Handys blöd aussieht.

und um die einzelnen Bereich abzugrenzen wollte ich Linien einfügen.

Herzliche Grüße

Matthias Scharwies