[TYPO3-german] CSS: dynamische Spaltenanordnung

Christoph Kuhn adonix at chrisk.ch
Fri Jul 6 18:43:15 CEST 2007


Hallo, 

ich möchte in einem Parent-DIV mit dynamischer Breite mehrere div's, welche je 
nach Breite automatisch ein, zwei oder gar drei-spaltig angeordnet werden.
Nun gibt sich aber das Problem, dass bei Angabe von min-width und max-width 
das erste div rasch auf max-width ausdehnt und das nächste nicht nebenan 
lässt, auch wenn beide in der vorgegebenen Breite platz hätten. Damit bleibt 
beim Aufziehen des Fensters rechts eine Lücke, bis die Lücke für die 
min-width des nächsten Divs genügend gross ist.

Unten ist die Aufgabe schematisch dargestellt. Wenn in der letzten Zeile ein 
div alleine bleibt, so spielt es keine Rolle, ob dieses nur die Breite des 
darüber liegenden einnimmt, oder die ganze Breite.

Bedingungen:
- die Anordnung der div's muss nur über CSS funktionieren (kein Java)
- die gesamte Breite des Parent-DIV muss immer ausgefüllt sein.
- die Spalten müssen gleichmässig verteilt sein.

Ist sowas überhaupt möglich?

Gruss

chris



von oben nach unten wird die Fensterbreite stets vergrössert:

-------
|  1  |
|     |
-------
|  2  |    Fensterbreite auf min-width Breite der divs
|     |
-------
|  3  |
|     |
-------


-----------
|    1    |
|         |
-----------
|    2    |    Fensterbreite auf auf max-width Breite der divs.
|         |    Wenn das Fenster noch etwas mehr verbreitert wird,
----------- 
|    3    | 
|         |
-----------


-------------
|  1  |  2  |
|     |     |
-------------   nehmen die divs wieder min-with Breite ein und
|  3  |         ein div springt in die obere Reihe.
|     |
-------


-----------------
|   1   |   2   |
|       |       |    Die Fensterbreite ist nun nahezu zweimal
-----------------    max-witdh breit. Wenn weiter verbreitert
|   3   |            wird,
|       |
---------


-------------------
|  1  |  2  |  3  |   springt das nächste div in die obere 
|     |     |     |   Reihe und alle haben min-width Breite.
-------------------


More information about the TYPO3-german mailing list