mehrere DIV-Spalten mit identischer Hoehe

[Sympatisant]

Hallo,

ich weiss, dass das Archiv und google voll mit solche Beitraegen sind. Aber die dort gefundenen Loesungen haben mich nicht befriedigt.

Und zwar geht es um eine Art Newsletter, wo ich mehrere DIV-Container nebeneinander auflisten moechte. Die Hoehe aller Container soll sich an der Hoehe des hoechten Containers orientieren.

Also in etwa so:
|------------------------|
| xy | za | ab | cd | gh |
|    | za | ab | cd | gh |
|    | za | ab | cd | gh |
|    | za |    |    | gh |
|    | za |    |    |    |
|------------------------|
In diesem Falle also an der 2. Spalte.

Nun habe ich Code gefunden, der zB fuer ein 3-Spalten-Layout nuetzlich ist. Dort wurde der mittleren Spalte jeweils eine Border rechts und links gegeben, die sich "hinter" die jeweiligen Spalten gelegt hat. Das funktioniert, allerdings hat es auch seine Macken; vor allem dann, wenn man statt einer einfachen Hintergrund-(bzw. Border-)farbe ein Hintergrundbild verwenden moechte.

Eine Tabelle, so sagt man ja, kommt hierfuer nicht in Frage. Auch wenn es damit so leicht waere ;)

Mein bisheriger Code klappt in so weit, dass die Container mittels DIVs gefloatet und somit nebeneinander aufgelistet werden. Aber halt nicht mit gleicher Hoehe.

Max-height, so wie Javascript oder Conditional Comments kommen fuer mich nicht in die Tuete (wobei ich letzteres vllt. noch verkraften wuerde). Denn m.M.n. sollte so eine - objektiv betrachtet - triviale Sachen ohne groesseren Aufwand realisierbar sein.

Wer mir helfen kann (und vor allem mag): nur zu! ;-)
Danke!

MfG,
Sympatisant

[suit]

Wer mir helfen kann (und vor allem mag): nur zu! ;-)

faux columns

[Sympatisant]

Salvete,

danke.

faux columns

..und was ist, wenn die Spalten in der Breite variieren (sich also vom Inhalt abheangig vergroessern oder verkleinern)?
Dann geht das doch auch schon wieder nicht.

MfG,
Sympatisant

[suit]

..und was ist, wenn die Spalten in der Breite variieren (sich also vom Inhalt abheangig vergroessern oder verkleinern)?

min-height wird dann ggf helfen - aber das mag der ie6 nicht (nicht ohne javascript)

was spricht gegen eine feste breite btw?

[Sympatisant]

Salvete,

min-height wird dann ggf helfen - aber das mag der ie6 nicht
(nicht ohne javascript)

Brr... wieso eigentlich nicht? Gab's das damals noch nicht?

was spricht gegen eine feste breite btw?

Da es sich um einen Newsletter handelt, den Redakteure mit Inhalt befuellen, kann es sein, dass sich eine Spalte mal vergroessert/verkleinert oder sogar ganz ausgeblendet werden soll.

MfG,
Sympatisant

[Thomas Luethi]

Hallo,

min-height wird dann ggf helfen - aber das mag der ie6 nicht
Brr... wieso eigentlich nicht? Gab's das damals noch nicht?

Doch.

min-width wurde mit CSS 2.0 eingeführt.
CSS 2.0 erhielt am 12.05.1998 den Status einer "W3C Recommendation".
(In der Working Group, die CSS 2 entwickelte, waren übrigens auch
Mitarbeiter von Microsoft vertreten.)

Zitat aus dem Wikipedia-Artikel zum Internet Explorer:
  "Version 6 erschien im Oktober 2001 und verbesserte die Unterstützung
  von CSS 1, DOM 1 und SMIL 2.0."

;-)

mfg Thomas

[Sympatisant]

Salvete,

Doch.
[..]

Na, was fuer ein Trost...

;-)

MfG,
Sympatisant

[Beat]

Schreibe in jedes float nach dem ersten ein leeres Behelfs <div> als letztes Element, das die Eigenschaft hat

div.machhalblang {clear:left; height:0; margin:0; padding:0; border:0}

Hab ich noch was vergessen?

mfg Beat

[Sympatisant]

Salvete,

Schreibe in jedes float nach dem ersten ein leeres Behelfs <div> als letztes Element, das die Eigenschaft hat

div.machhalblang {clear:left; height:0; margin:0; padding:0; border:0}

Das habe ich jetzt nicht verstanden.

Ich habe folgendes ausprobiert (wobei Klasse "test" deinen Angaben entspricht):

  
 <div id="wrapper">  
  
 <div class="column" id="columnLeft">  
  ###COLUMN_LEFT###  
 </div>  
  
 <div class="column" id="columnCenter">  
  ###COLUMN_CENTER###  
  <div class="test"></div>  
 </div>  
  
 <div class="column" id="columnRight">  
  ###COLUMN_RIGHT###  
  <div class="test"></div>  
 </div>  
  
 <div class="column" id="columnBorder">  
  ###COLUMN_BORDER###  
  <div class="test"></div>  
 </div>  
  
 <div class="clearfix"></div>  
 </div>  

Auch wenn ich das Test-Div ausserhalb der Column-Container packe, erziele ich nicht das erwuenschte Ergebnis.

Hab ich noch was vergessen?

Vielleicht ;-)

Danke & MfG,
Sympatisant

[Sympatisant]

Salvete,

nun, ich habe das jetzt mit Tabellen umgesetzt.
Das ist doch echt ein Armutszeugnis fuer CSS(*), dass so etwas einfaches
nicht umzusetzen geht(**) ;-(

* bzw. IE
* ohne irgendwelchen Schnickschnack oder Sonderbehandlungen

Nicht ganz so erfreute Gruesse,
Sympatisant

[Beat]

nun, ich habe das jetzt mit Tabellen umgesetzt.
Das ist doch echt ein Armutszeugnis fuer CSS(*), dass so etwas einfaches
nicht umzusetzen geht(**) ;-(

Jaja
Tabellen missbrauchen oder Floats missbrauchen.
Und über so was streitet die Welt.

Ich hab' mir sagen lassen, die besten Bücher werden immer noch unter den schrecklichsten Umständen gelesen: Mit der Taschenlampe unter der Bettdecke.
;))

mfg Beat

[Sympatisant]

Salvete,

Tabellen missbrauchen oder Floats missbrauchen.
Und über so was streitet die Welt.

Gibt ja sonst nichts worueber man sich aufregen kann ;-p

Aber in meinem Fall missbrauche ich lieber eine Tabelle, statt mit irgendwelchem Javascript o.ae. um die Ecke zu kommen..

Ich hab' mir sagen lassen, die besten Bücher werden immer noch unter
den schrecklichsten Umständen gelesen: Mit der Taschenlampe unter der
Bettdecke.

Das waren noch Zeiten...

MfG,
Sympatisant