Witam.
Mam dwa divy obok siebie.
Jeden ma automatyczną wysokość a drugiego nie umiem dopasowywać
automatycznie do (z góry nieznanej) wysokości tego pierwszego. Wiadomo,
co co chodzi.

Oba są obramowane (border) i pewnie się domyślacie, jak to wygląda -
ramka prawej kolumny kończy się kompletnie od czapy - w połowie strony
na przykład.

Co można zrobić, żeby te obramowania były równe (nie używając
JavaScript)? Interesują mnie tylko najnowsze wersje popularnych
przeglądarek.

do góry

Dnia 26-12-2010 o 00:18:38 mokpl <m...@g...pl> napisał(a):

> Witam.
> Mam dwa divy obok siebie.
> Jeden ma automatyczną wysokość a drugiego nie umiem dopasowywać
> automatycznie do (z góry nieznanej) wysokości tego pierwszego. Wiadomo,
> co co chodzi.
>
> Oba są obramowane (border) i pewnie się domyślacie, jak to wygląda -
> ramka prawej kolumny kończy się kompletnie od czapy - w połowie strony
> na przykład.
>
> Co można zrobić, żeby te obramowania były równe (nie używając
> JavaScript)? Interesują mnie tylko najnowsze wersje popularnych
> przeglądarek.

#calosc{
display:table-row;
}
#calosc>div{
display:table-cell;
}

<div id="calosc"><div /><div /></div>

niepojete, czemu to rozwiazanie tak niepopularne jest...

--
Jordan Szubert

do góry

Dnia Sun, 26 Dec 2010 00:18:38 +0100, mokpl napisał(a):

> Co można zrobić, żeby te obramowania były równe (nie używając
> JavaScript)? Interesują mnie tylko najnowsze wersje popularnych
> przeglądarek.

Faux columns z obrazkiem obramowania, uzupełniony drugim kontenerem na
dolną (lub górną) część, jeśli ma się jakoś zamykać. Oczywiście jeśli
musisz obsłużyć (tfu, tfu) IE6.

--
Borys Pogoreło
borys(#)leszno,edu,pl

do góry

W dniu 2010-12-26 00:55, Jordan Szubert pisze:
> Dnia 26-12-2010 o 00:18:38 mokpl <m...@g...pl> napisał(a):
>
>> Witam.
>> Mam dwa divy obok siebie.
>> Jeden ma automatyczną wysokość a drugiego nie umiem dopasowywać
>> automatycznie do (z góry nieznanej) wysokości tego pierwszego.
>> Wiadomo, co co chodzi.
>>
>> Oba są obramowane (border) i pewnie się domyślacie, jak to wygląda -
>> ramka prawej kolumny kończy się kompletnie od czapy - w połowie strony
>> na przykład.
>>
>> Co można zrobić, żeby te obramowania były równe (nie używając
>> JavaScript)? Interesują mnie tylko najnowsze wersje popularnych
>> przeglądarek.
>
> #calosc{
> display:table-row;
> }
> #calosc>div{
> display:table-cell;
> }
>
> <div id="calosc"><div /><div /></div>
>
> niepojete, czemu to rozwiazanie tak niepopularne jest...

Z powodu IE6? Teraz wg mnie można już go śmiało pomijać.
Można jeszcze spróbować z właściwości display:box; Choć jeszcze nie
wszystkie przeglądarki to obsługują.

http://kamilpelka.com/2010/12/03/css3-flexbox-koniec
-z-floatami-kiedys/

--
Peter

do góry