Neu Container-Höhe fixieren je nach Höhe des Hintergrundbildes

schnabeltasse

Aktives Mitglied
14. Juni 2020
20
18
Hallo zusammen :)

gibt es eine Lösung hierfür?
Ich will einen Container mit einem statischen Hintergrundbild in einem bestimmten Format z.B. 200px breit und 400px hoch.

Je nachdem, wieviel Inhalte in diesem Container sind (Überschrift, Text, Button) wir die Höhe des Containers aber unten abgeschnitten.
Wenn ich mehrerer solcher Container mit unterschiedlichem Inhalt (aber gleich großem Hintergrundbild) nebeneinander in einem Grid Layout anordne, sieht das ziemlich doof aus.

Hat jemand von Euch eine Idee, wie man mit Boardmitteld des OPC einen Container genau auf die Höhe bekommt, so dass exat das Format Hintergrundbildes dargestellt wird?
Ich kämpfe schon seit längerem, schaffe es aber nicht :(

Für einen kurzen Tipp vielen Dank im Voraus :)
Schöne Grüße, JürgenScreenshot 2023-10-22 142324.png
 
Zuletzt bearbeitet:

css-umsetzung

Offizieller Servicepartner
SPBanner
6. Juli 2011
7.101
1.859
Berlin
Einem Container kannst du im OPC ja sagen wie hoch er mindestens sein soll.
Du meinst vermutlich die spalten.

Gib dann dem Grid eine Klasse und formatiere diese entsprechend über css
 

schnabeltasse

Aktives Mitglied
14. Juni 2020
20
18
Vielen Dank für den Hinweis :)
So langsam nähere ich mich dem gewünschten Ergebnis:
Screenshot 2023-10-23 135052.png
Links und rechts im Grid-Layout sind jeweils ein Bild und in den beiden mittleren sind Container mit Hintergrundbild - soweit so gut.
Solange ich im responsive Design ein ausreichend großes Gerät habe, das mindestens zwei Spalten nebeneinander anzeigt, passt alles - siehe hier: Screenshot 2023-10-23 141359.png
Aber auf einem Handy, mit der Darstellung auf nur einer Spalte sieht es leider so aus:
Screenshot 2023-10-23 142057.png
Hier werden die Container-Höhen auf den Inhalt begrenzt.
Beim Container verwende ich h-100 bei benutzerdefinierte Klassen.
Stimmt das?