Erledigt - Automatisch Höhe der Box nebenan annehmen?

[Jamye]

Moin Leute,
ich suche seit längerer Zeit eine Lösung für folgendes Problem:




Wie hier zu sehen, habe ich einen gelben Wrapper und in ihm eine Rote, sowie eine Grüne Box.
Ich suche nun nach einer Möglichkeit, den Wrapper so klein zu halten, wie die größte Box ist und die kleinere beider Boxen so groß zu werden, wie der Wrapper is.
Sinn dahinter soll sein, dass bei einem Template, in dem man nicht weiß, welche Box mehr Inhalt haben wird, beide letztendlich trotzdem gleich groß bleiben.

In dem Bild habe ich versucht, dem Wrapper die Eigenschaft "height:auto" zu geben und meine nächste Idee war es, anschließend beiden Boxen die Eigenschaft "height:100%" zu geben.
Nur gebe ich der roten Box alleine diese Eigenschaft, vergrößert sie den Wrapper und sich selbst über die komplette Bildschirmlänge...

Irgendwie auch logisch

Nur wie komme ich jetzt zum Ziel und ist mein Vorhaben überhaupt rein in HTML und CSS umsetzbar?!

Vielen Dank an alle, die sich meines Problems annehmen ;-)

 

[noltehans]

Hi Jamye,

 

[Jamye]

Wunderbar, vielen Dank für die schnelle Antwort.
Darauf muss man ja auch erst einmal kommen!

 

[Myhar]

Der andere (modernere) Weg ist, dies mittels Flexbox umzusetzen. Das verstehen aber ältere Browser (insbesondere IE) nicht so gut.

 

[Jamye]

Werde ich mir mal angucken Myhar.
Wenn die Möglichkeit moderner und praktischer ist, bleibt dann ja nur noch der Zeitpunkt abzuwarten, an dem man möglichst wenig Nutzer dadurch benachteiligt.

 

[Myhar]

Flexbox kann so viel mehr als nur gleiche Höhe, ganz einfach ist die Anwendung auch nicht unbedingt (Ich habe etwas rumprobieren müssen bis ich das Grundkonzept mal raus hatte )
Verwenden kann man es jetzt schon, in deinem Fall würden Besucher mit einem alten Browser eben nicht zwei gleich hohe Boxen zu sehen bekommen. Wie hinderlich das für dich ist, musst du entscheiden.

 

[Jamye]

Sieht ja wirklich schon gut implementiert aus!
Das kann ich mir vorstellen, dass man da erst einmal etwas rum experimentieren muss.
Die Zeit werde ich mir demnächst auch nehmen.

Ich kann die Höhen der Boxen erst einmal statisch setzen, nur wenn ich das Template wirklich noch in Wordpress einpflegen sollte, könnte es Probleme geben und ein Loch in verschiedenen Stellen des Templates hauen.