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: ~~~ html <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: ~~~ CSS body { display: grid; grid-template-columns: 1fr 1fr; } header { grid-column: span 2; } ~~~ Besser wäre es, die 2-Spaltigkeit mit [media queries](https://wiki.selfhtml.org/wiki/CSS/Tutorials/Einstieg/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 -- *"I don’t make typos. I make new words."*

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: ~~~ html <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: ~~~ CSS body { display: grid; grid-template-columns: 1fr 1fr; } header { grid-column: span 2; } Besser wäre es, die 2-Spaltigkeit mit [media queries ](https://wiki.selfhtml.org/wiki/CSS/Tutorials/Einstieg/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 -- *"I don’t make typos. I make new words."*