wie diese Seite hier. Links: Inhaltsverzeichnis - rechter Block: Text fließt um den linken Block herum

css (Inhaltsverzeichnis links) {float: left; text-align: left; width: 250px; padding: 10px; margin-right: 10px; margin-bottom: 5px; font-size: 1.1em; border: solid 3px black;}

marging Hält Abstand zum Text rechts, da der Textblock rechts bis nach ganz links fließt und das Inhaltverzeichnis mit in sich einschließt.

Rechts Inhalt: {text-align: left; max-width: 100%;}

Wie ein Inhaltsverzeichnis.
Im Laptop: Blöcke plazieren sich nebeneinander.
Im Handy: Blöcke sind untereinander.

css (Inhaltsverzeichnis links) {float: left; text-align: left; width: 250px; padding: 10px; margin-right: 10px; margin-bottom: 5px; font-size: 1.1em; border: solid 3px black;}

marging Hält Abstand zum Text rechts, da der Textblock rechts bis nach ganz links fließt und das Inhaltverzeichnis mit in sich einschließt.

Rechts Inhalt: {text-align: left; max-width: 100%;}

Poligon ist eine Funkion

clip-path: polygon(0% 5%, 100% 50%, 100% 75%, 0% 100%)

Die vier Zahlenpaare sind die Orte der 4 Ecken: ObenLinks - ObenRechts - UntenRechts - UntenLinks
Es wird immer von oben nach unten gemessen und von links nach rechts.
Erste Zahl ist Abstand von links. Zweite Zahl ist Abstand von oben.

Beispiel: #KonischesFeld {width: 500px; height: 150px; clip-path: polygon(0% 5%, 100% 50%, 100% 75%, 0% 100%);}