Hallo Matthias,

so, die Unterstreichung ist drin und die "Wie fange ich an" Seite ist auf die Vorlage umgestellt.

Ich muss gestehen, dass das mehr Arbeit war als gedacht. Kann aber auch daran liegen, dass das Feintuning der Card-vorlage und der Einbau auf die Seite sich gegenseitig gestört hat 😉

Ich habe noch einen Parameter vollbild= hinzugefügt. Der wird alternativ zu "bild" verwendet und führt dazu, dass der Titelbereich auf position:absolute gesetzt wird, so dass er über dem Bild schwebt. Die Card "der richtige Code-Editor" gewinnt dadurch. Und ich habe das Idee-Bild für "Vom der Idee zum Projekt" etwas niedriger gemacht, sonst war da zu viel Abstand drüber. Hätte ich auch lassen können, als "vollbild" wäre das viel einfacher gewesen. Aber das habe ich erst danach gebaut 🙄.

Was mir jetzt noch fehlt, ist eine Idee, wie ich ein Bild bündig an die Unterkante der Card setze, wenn Nachbarcards die Höhe der Card-Zeile erhöhen. Das müsste man bei "Bilder im Internet" tun. Aber wie man das korrekt in den Rest des Card-Layouts integriert, das ist mir noch unklar. Eigentlich müsste der Card-Inhalt mit display:flex erstellt werden und der Inhaltsbereich mit flex:1 0 auto erstellt werden. Aber das hat andere Störeffekte, Flexitems haben ihren eigenen Blockformatierungskontext und das gefloatete Icon kann dann nicht mehr aus dem Titel hinausragen. Vermutlich gibt's da keine Universallösung 😟. Bild als Hintergrundbild erstellen und der Card eine Mindesthöhe geben ist auch nicht drin, weil die Bildhöhe ja mit der Card-Breite wechseln kann. Sollte man die Cards zu Containern machen?

Rolf