Witam,

Wiem że sprawa dwu- trzykolumnowego layoutu z wykorzystaniem div,
pojawiała się tu już niejednokrotnie. Generalnie nie miałem do tej pory
  problemów z tworzeniem layout'ów na div'ach, ale jednak...

Na stronie jest div#0 który zawiera 2 inne divy.
Mniej więcej coś takiego:

------------------------
|    header            |
------------------------
|          0           |
| -----  ------------- |
| |   |  |           | |
| |   |  |           | |
| | 1 |  |     2     | |
| |   |  |           | |
| |   |  |           | |
| -----   ------------ |
------------------------
|       stopka         |
------------------------

I nie było by problemu, gdyby nie to że zawartość div#1 i zawartość
div#2 są dynamicznie generowane przez PHP. Stwarza to taki problem że
nie wiem, który div jest dłuższy, a co za tym idzie nie potrafię
rozciągnąć zawartości div#0, ponieważ jeśli dam div#1{float: left}, to
nie będzie on rozciągał div#0 w momencie gdy będzie dłuższy niż div#2. I
odwrotnie, jeśli ustawie div#2{float:right} to nie będzie on rozciągał
div#0 jeśli będzie dłuższy niż div#1.
Nie wiem jak sobie z tym poradzić.
No całkiem możliwe, że jest jakieś proste rozwiązanie, a ja daleko
szukam. Jednak nie mam pomysłu.
Oczywiście nie chce tego pakować w tabele, bo mimo wszystko polubiłem divy.

Pozdrawiam

Witam,

Na stronie jest div#0 który zawiera 2 inne divy.
I nie było by problemu, gdyby nie to że zawartość div#1 i zawartość
div#2 są dynamicznie generowane przez PHP. Stwarza to taki problem że
nie wiem, który div jest dłuższy, a co za tym idzie nie potrafię
rozciągnąć zawartości div#0, ponieważ jeśli dam div#1{float: left}, to
nie będzie on rozciągał div#0 w momencie gdy będzie dłuższy niż div#2. I
odwrotnie, jeśli ustawie div#2{float:right} to nie będzie on rozciągał
div#0 jeśli będzie dłuższy niż div#1.

A co mają zawierać te div#1 i div#2?
Domyślam się (może błednie), że div#1 to coś w rodzaju menu, div#2 to
coś w rodzaju treści.

Wydaje mi się, że może wystarczyć tutaj min-height dla div#0.

Wydaje mi się, że może wystarczyć tutaj min-height dla div#0.

+ prawdopodobnie .js dla IE.

| Wydaje mi się, że może wystarczyć tutaj min-height dla div#0.

+ prawdopodobnie .js dla IE.

a to w jakim celu?
przecież IE też obsługuje 'min-height'. Tyle, że nazywa to 'height'.

| Witam,

| Na stronie jest div#0 który zawiera 2 inne divy.

| I nie było by problemu, gdyby nie to że zawartość div#1 i zawartość
| div#2 są dynamicznie generowane przez PHP. Stwarza to taki problem że
| nie wiem, który div jest dłuższy, a co za tym idzie nie potrafię
| rozciągnąć zawartości div#0, ponieważ jeśli dam div#1{float: left}, to
| nie będzie on rozciągał div#0 w momencie gdy będzie dłuższy niż div#2.
| I odwrotnie, jeśli ustawie div#2{float:right} to nie będzie on
| rozciągał div#0 jeśli będzie dłuższy niż div#1.

A co mają zawierać te div#1 i div#2?
Domyślam się (może błednie), że div#1 to coś w rodzaju menu, div#2 to
coś w rodzaju treści.

Wydaje mi się, że może wystarczyć tutaj min-height dla div#0.

Dobrze się domyślasz, z tym że to menu po lewej będzie generowane
dynamicznie. Będzie ono zawierać kategorie produktów z oferty pewnej
firmy, jednak oferta ta będzie mogła być zwiększana (dodawanie kategorii
produktów) lub zmniejszana (usuwanie tych kategorii). Tych kategorii
może być od kilku do kilkunastu. Natomiast w divie prawym będą
wyświetlane szczegółowe informacje na temat tych kategorii/produktów.
Więc może się zdarzyć np. że dana kategoria będzie zawierać wiele
produktów i wówczas prawy div będzie dłuższy niż lewy i to on powinien
rozciągać rodzica. Lecz może być też tak że opis produktu będzie np.
jeden lub dwa i wówczas lewa kolumna będzie dłuższa i to ona powinna
rozciągać rodzica.
Mógłbym zastosować min-height gdyby np. lewa kolumna miała stałą
wysokość. Wówczas bym móg zrobić dla div#0(min-height: (wyskość lewej
kolumny)px}.
Ale niestety wysokość lewego diva może się zmieniać, więc nie za bardzo
mogę wykorzystać min-height.
No chyba że źle kombinuję z tym min-height.

Mógłbym zastosować min-height gdyby np. lewa kolumna miała stałą
wysokość. Wówczas bym móg zrobić dla div#0(min-height: (wyskość lewej
kolumny)px}.
Ale niestety wysokość lewego diva może się zmieniać, więc nie za bardzo
mogę wykorzystać min-height.
No chyba że źle kombinuję z tym min-height.

Czy nie możesz zatem ustawić min-height jako maksymalną możliwą wysokość
   pierwszej kolumny? Czy bardzo to zepsuje layout?

Subject: Re: 2 kolumnowy =?ISO-8859-2?Q?uk=B3ad?=

Mógłbym zastosować min-height gdyby np. lewa kolumna miała stałą
wysokość. Wówczas bym móg zrobić dla div#0(min-height: (wyskość lewej
kolumny)px}.

Ze tak sie wtrace do dyskusji - a musisz miec tego div#0?
Moze da sie obejsc bez tego?

[...]

a to w jakim celu?
przecież IE też obsługuje 'min-height'. Tyle, że nazywa to 'height'.

http://www.doxdesk.com/software/js/minmax.html

| Subject: Re: 2 kolumnowy =?ISO-8859-2?Q?uk=B3ad?=

| MógÂłbym zastosowaĂŚ min-height gdyby np. lewa kolumna miaÂła sta³¹
| wysokoœÌ. Wówczas bym móg zrobiĂŚ dla div#0(min-height: (wyskoœÌ lewej
| kolumny)px}.

Ze tak sie wtrace do dyskusji - a musisz miec tego div#0?
Moze da sie obejsc bez tego?

Musi, nie musi... Taki miałem akurat pomysł, że pasował mi ten div#0,
który miał ustawiony background-image, i miałbyć tłem dla reszty.
Jeżeli mi się nie uda ustawić tych divów tak jak chcę to będe musiał
koncepcję wyglądu strony.

Czy nie możesz zatem ustawić min-height jako maksymalną możliwą wysokość
  pierwszej kolumny? Czy bardzo to zepsuje layout?

No w sumie mógłbym załozyć np. że 1 kolumna nie będzie wyższa niż np.
300px i ewentualnie dodać jej overflow: auto, jeśli by jednak po jakimś
czasie się zbyt wydłużyła :).
Nie jest to rozwiązanie 100% takie jak bym chciał, no ale zobaczę jak to
będzie wychodzić.
Moze jednak trzeba będzie grafikę zmodyfikować :(
Dzięki za odpowiedzi wszystkim

I nie było by problemu, gdyby nie to że zawartość div#1 i zawartość
div#2 są dynamicznie generowane przez PHP. Stwarza to taki problem że
nie wiem, który div jest dłuższy, a co za tym idzie nie potrafię
rozciągnąć zawartości div#0, ponieważ jeśli dam div#1{float: left}, to
nie będzie on rozciągał div#0 w momencie gdy będzie dłuższy niż div#2. I
odwrotnie, jeśli ustawie div#2{float:right} to nie będzie on rozciągał
div#0 jeśli będzie dłuższy niż div#1.
Nie wiem jak sobie z tym poradzić.

Yyy... ale dlaczego nie będzie rozciągał? Czy div0 ma jakąś stałą
wysokość? Daj dla div1 i div2 height: auto; i odpowiednie floaty. Dla
gecko musisz jeszcze wstawić tuż przed zakończeniem div0 jakis element z
  clear: both; i z głowy.

P. Kręglicki

Witam,

Wiem że sprawa dwu- trzykolumnowego layoutu z wykorzystaniem div,
pojawiała się tu już niejednokrotnie. Generalnie nie miałem do tej pory
 problemów z tworzeniem layout'ów na div'ach, ale jednak...

Być może to Cię zainteresuje:
http://www.alistapart.com/articles/fauxcolumns/

Pozdrawiam

--
serdecznie pozdrawiam
JK

Wiem że sprawa dwu- trzykolumnowego layoutu z wykorzystaniem div,
pojawiała się tu już niejednokrotnie. Generalnie nie miałem do tej pory
 problemów z tworzeniem layout'ów na div'ach, ale jednak...
[...]
No całkiem możliwe, że jest jakieś proste rozwiązanie, a ja daleko
szukam. Jednak nie mam pomysłu.

No, strasznie daleko. Szkoda, że do archiwum nie zajrzałeś, znalazłbyś

Pzdr, YaaL.

Wiem że sprawa dwu- trzykolumnowego layoutu z wykorzystaniem div,
pojawiała się tu już niejednokrotnie. Generalnie nie miałem do tej pory
 problemów z tworzeniem layout'ów na div'ach, ale jednak...
[...]
No całkiem możliwe, że jest jakieś proste rozwiązanie, a ja daleko
szukam. Jednak nie mam pomysłu.

No, strasznie daleko. Szkoda, że do archiwum nie zajrzałeś, znalazłbyś

Nie dokładnie twój problem, ale zbliżony na tyle, że odpowiedź i dla
ciebie będzie wartościowa.

Pzdr, YaaL.

Yyy... ale dlaczego nie będzie rozciągał? Czy div0 ma jakąś stałą
wysokość? Daj dla div1 i div2 height: auto; i odpowiednie floaty. Dla
gecko musisz jeszcze wstawić tuż przed zakończeniem div0 jakis element z
 clear: both; i z głowy.

P. Kręglicki

No faktycznie, tyle że prawie jestem pewny, że tego próbowałem i nie
działało. Teraz zrobiłem i dalej nie działa na moim layoucie. Ale
pomyślałem, mogłem coś za bardzo zamieszać, więc zrobiłem sobie na
szybko coś takiego: http://done.w.szu.pl/tescik/ i działa!!
Więc po prostu jednak coś zamieszałem i teraz musze zobaczyć co. ;)
Dzięki za pomoc.
Pozdrawiam