3 komórki takiej samej dlugosci? Opcje

[1010]

mam trzy komórki (div). Leża one jedna obok drugiej. I chciałbym aby ich wysokość była zawsze równa i rozciągała się wraz z zawartością najpełniejszej z nich... Czy takie coś jest mozliwe?

[barat]

Odwieczny problem CSS ... niby jest coś takiego jak display:table i display:cell , jednak nie działa to tak jak powinno ...

Jednym ze sposobów jest wsadzenie tych 3 divów w jeden kontener, a dla kontenera ustawić background-image z repeat-y (cieniutki pasek) by rysowało kolumny , wtedy każda z tych divów rozciągnie kontener który stworzy wrażenie, że pozostałe komórki też się zwiększyły.

Gdzieś też widziałem rozwiazanie z javascriptem, że brało by ID , wybierało najwyższy i pozostałym ustawiało takie samo , ale wtedy jak nie ma JS to pozamiatane

Ten post edytował barat 17.08.2007, 11:56:52

[revyag]

Można divom ustawić też duż padding i minusowy margin tej samej wartości.
np.

Kod

div#wrap {
    height:100%;
    overflow:hidden;
}
div.col {
    float:left;
    width:200px;
    padding-bottom:2000px;
    margin-bottom:-2000px;
}

[HTML] pobierz, plaintext 
<div id="wrap">
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
</div>
[HTML] pobierz, plaintext 

[Kreton]

http://perfectionorvanity.com/2007/03/07/r...ny-layoutu-css/

[1010]

Jednym ze sposobów jest wsadzenie tych 3 divów w jeden kontener, a dla kontenera ustawić background-image z repeat-y (cieniutki pasek) by rysowało kolumny , wtedy każda z tych divów rozciągnie kontener który stworzy wrażenie, że pozostałe komórki też się zwiększyły.

Ten sposób wykorzystałem... Całkiem fajny... Nie wpadłem na to

[barat]

Bardzo powszechny sposób

To jest tzw faux columns

http://www.alistapart.com/articles/fauxcolumns/

alistapart - polecam

Sposób jaki podał Kreton też już kiedyś czytałem ... ale tam jest jedno mądre zdanie :

"ważne jest też dopasowanie metody do skali efektu końcowego."

Do prostych układów faux columns sprawdza się wyśmienicie