CSS height: 100% / height: auto

[Rockhound]

Hi Leute,
ich möchte gerne das auf der Seite hier: www.nooon.de Die beiden Spalten "Angebote" und "Events" gleich lang sind weil sich der Inhalt meistens auch gleich lang erstreckt.
Habe den "Vaterelementen" height: 100% verpasst und dachte das ich dann den 2 Spalten ein height: auto verpasse und gut ist.
Leider ist dem aber nicht so
Jemand den Clou was ich falsch mache.

Vielen Danke

 

[Fermion]

Equal Height Columns with Cross-Browser CSS

Wenn du es dir leicht machen willst (da die Breite ja fest definiert ist):
Leg um die beiden weißen Boxen einen weiteren Container mit einem weißen Hintergrundbild (inkl der transparenten Lücke dazwischen!). Dann schaut es so aus, als wären beide Boxen gleich groß.
Aber vergess nicht zu clearen, sonst wächst der neue Container außenrum nicht mit.

Edit (Erklärung):
Verpass dem Container #angeboteevents eine Hintergrundgrafik ähnlich der folgenden:

 

[h3rbert]

Solche Spielchen können sehr kniffellig sein. Könntest es mit JS machen was natürlich absoluter Quatsch ist, oder du probierst es über CSS.

Dann würde ich dir empfehlen den Hintergrund von Angebote und Events in eine Datei zu machen wobei der Abstand zwischen den beiden Elementen transparent ist (GIF ausreichen hier, oder PNG).

Dann gibst du dem Element, das Angebote und Events umschließt diesen Hintergrund der über beide Blöcke geht. Solltest dann den untergeordneten Elementen die eigenen Hintergründe rausnehmen und den float löschen (aber das hast du ja sicherlich schon). Da das umfassende Element den Hintergrund besitzt wird dann automatisch der Hintergrund auf beiden Seiten verlängert.

Edit: Vorgänger sagt genau das gleiche ;D