DIVs verschachteln und anordnen

[lala]

Hi,
ich hab da ein Problem. Ich möchte zwei DIVs, die nebeneinander liegen, aber unterschiedlich hoch sind, mit jeweils border-right haben, aber der Rahmen soll bis zur Unterkante des jeweils längsten DIV gehen. Verstanden?

|-------------I-------------I
| text text t I text text t I
| text text t I text text t I
| text text t I text text t I
| text text t I text text t I
| text text t I text text t I
| text text t I text text t I
| text text t I text text t I
| text text t I text text t I
| text text t I text text t I
| text text t I             I
| text text t I             I
| text text t I             I
| text text t I             I
|-------------I-------------I

so soll es aussehen. ( nur I ist ein Rahmen | und - nicht) Es sieht in Mozilla aber leider so aus, was ziemlich doof ist:

|-------------I-------------I
| text text t I text text t I
| text text t I text text t I
| text text t I text text t I
| text text t I text text t I
| text text t I text text t I
| text text t I text text t I
| text text t I text text t I
| text text t I text text t I
| text text t I text text t I
| text text t I             |
| text text t I             |
| text text t I             |
| text text t I             |
|-------------I-------------|

Ich hab schon versucht die beiden DIVs in ein übergeordnetes DIV zu packen, welches dann den rechten Rahmen macht, aber Mozilla zeigt dieses übergeordnete DIV gar nicht an, wenn man keine Höhe angibt.

[Simon]

Hallo,

ich kenne das Problem, aber leider keine wirkliche Lösung dafür. Bis jetzt habe ich entweder eine feste Höhe für die DIVs vergeben (wo es ging) oder das Layout so verändert, daß es auch ohne die Rahmen gut aussieht.

Simon

[wahsaga]

hi,

ich hab da ein Problem. Ich möchte zwei DIVs, die nebeneinander liegen, aber unterschiedlich hoch sind, mit jeweils border-right haben, aber der Rahmen soll bis zur Unterkante des jeweils längsten DIV gehen. Verstanden?

verstanden ja.
aber du musst erst einmal verstehen, dass man mit CSS nicht immer ein tabellenlayout "nachbauen" kann.
z.b. dein fall, zwei elemente auf gleiche höhe zu bekommen, und noch dazu mit dynamischer höhe, ist ein problemfall, der mit CSS nicht so ohne weiteres umzusetzen ist.

Ich hab schon versucht die beiden DIVs in ein übergeordnetes DIV zu packen, welches dann den rechten Rahmen macht, aber Mozilla zeigt dieses übergeordnete DIV gar nicht an, wenn man keine Höhe angibt.

das liegt ziemlich sicher daran, dass du entweder float oder aber absolute positionierung benutzt hast, um die beiden divs nebeneinander zu bekommen.
float und absolute positionierung heben elemente bekanntlich aus dem textfluss heraus, d.h. sie können danach die höhe ihrer elternelemente gar nicht mehr beeinflussen.

beim floaten kannst du dies aber umgehen, in dem du nach den beiden divs noch ein weiteres, leeres element mit ins elternelement aufnimmst, welches du mit clear:(left|right|both) (je nach art des floatens) formatierst.

gruss,
wahsaga

[lala]

z.b. dein fall, zwei elemente auf gleiche höhe zu bekommen, und noch dazu mit dynamischer höhe, ist ein problemfall, der mit CSS nicht so ohne weiteres umzusetzen ist.

aha, danke

das liegt ziemlich sicher daran, dass du entweder float oder aber absolute positionierung benutzt hast, um die beiden divs nebeneinander zu bekommen.

genau

beim floaten kannst du dies aber umgehen, in dem du nach den beiden divs noch ein weiteres, leeres element mit ins elternelement aufnimmst, welches du mit clear:(left|right|both) (je nach art des floatens) formatierst.

hat das elternelement dann die richtige höhe? ich probiers mal aus...