CSS height pitanje

[ThePocetnik]

Ovako imam jedan div kome je visina postavljena na auto tj. nije fiksirana.

U njemu se nalazi levi i desni div. U levom divu ide sadrzaj te je njegova visina takodje postavljena na auto, kako bi se od sadrzine automatski menjala.
Desni div bi trebalo da ima visinu levog, bez obzira na sadrzaj u njemu.
Naime zelim da se u desnom divu nalazi slika centrirana po vertikali, a da ostatak diva bude nacinjen od background boje.

Ali nikako ne mogu da namestim da desni div uzme visinu od levog ili barem od parent elementa. Stavio sam i height: inherit, ali i dalje je visina postavljena na auto. Probao sam i height: 100%, ali ni to ne radi posao tj. i dalje zavisi visina od sadrzaja u desnom divu.

Da li ikako mogu da podesim (da li u CSS-u ili samom index.php-u) i da kazem desnom divu da preuzme ili trenutnu visinu levog ili barem visinu parent elementa.

Java resenje me ne zanima, jer gledam da to izbegnem kad god je to moguce.

 

[miha]

probaj ovo da stavis za taj desni

    display: inline-block;
    vertical-align: top;

btw... bolje da si postavio kod nego ovako opisno... morao sam 5x da citam

 

[ThePocetnik]

Probao, ali ne funkcionise

I dalje njegova visina zavisi od visine slike koje stavim u taj modul.

Evo stavicu sada kod:

#content-menu{
width: 970px;
margin: auto;
overflow: hidden;
background-color: #ffffff;
}

#rightmenu {
width: 192px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
padding-bottom: 0px;
/*float: left;
height: inherit;*/
display: inline-block;
vertical-align: top;
background-color: #000000;
/*overflow: auto;*/
}
#content {
width: 768px;
float: left;
margin: 0,0,0,0;
overflow: hidden;
padding-left: 5px;
padding-right: 5px;
padding-top: 5px;
padding-bottom: 5px;
min-height: 350px;
font-size: 14px;

content-menu je master div u kojem se nalaze DIV rightmenu(desno) i content(levo).
Pokusavao sam gotovo sve kombinacije, pa cak i one za koje sam bio siguran da nece da rade.

 

[Exibeat]

Evo, mislim da sam nasao resenje, sad cu ti napisati kod.

 

[Exibeat]

html kod

<div id="sadrzaj">
    <div id="levidiv" class="divovi">
        ovde stavis neki tekst<br>
        bla<br>
        bla<br>
        bla<br>
    </div>
    <div id="desnidiv" class="divovi">
        ovde mozes da stavis neku sliku<br>
        to verovatno znas da uradis :D 
    </div>
</div>

ovo je css kod

#sadrzaj {
    border: 1px;
    display: table;
}
.divovi {
    display: table-cell;
}
#levidiv {
    border: 3px solid blue;   
    width: 100px;
}
#desnidiv {
    border: 3px solid green;  
    width: 500px;
}

 

[ThePocetnik]

Hvala, ovo vec funkcionise.

Updateovao sam index.php i template.css prema ovim uputstvima, i obrisao sam diplay: inline-block iz #rightmenu-a, i tako funkcionise.

 

[FantomX]

 

[miha]

dodjem da vidim sta se desava... kad ono

 

[Darko]

Ovo je u stvari divan primer vracanja korenima. Pozdravljam popravljen problem, ali interesantno je kako se mic po mic vracamo tabelama - ali ovog puta preko CSSa

 

[ThePocetnik]

Pa kada tako jedino i radi, barem za sada.

Ako najdem neko resenje bez tabela javicu. Mada mi nije jasno zasto height: inherit koji nasledjuje visinu od parent elementa cija je visina identicna levom panelu ne vrsi posao. Jedino ako inherit ne nasledjuje izracunatu vrednost parametra prilikom prikaza, vec sam parametar koji je postavljen na auto isl...

 

[miha]

inherit nasledjuje vrednost parametra.

centriranje po vertikali je najdosadniji problem... ako bilo ko ima neke lepe primere neka stavi... stavicu kasnije jedan primer se height postavlja iz velicine contenta u iframe-u (naravno da je JS u pitanju ali eto primenio to juche pa dok je sveze)