mám stránku v tvare hlavička, 3 stĺpce a petička. Stĺpce majú minimálnu výšku 550px, no výška stredného závisí od obsahu. A tu mi vzniká problém. Dá sa v css nejako nastaviť, že keď mám stredný stĺpec napríklad 800px tak nech aj krajné natiahne podľa stredného???
Fórum › CSS
3 stĺpcový layout

Jde o to, co se má v těch sloupcích natáhnout.
Výšku, tj. height těch sloupců umí přizpůsobit jen JS (to by byl případ, kdybys měl třeba orámování kolem krajního sloupce).
Ale pokud by ses spokojil s protažením barvy/obrázku na pozadí, tak to jde za pomoci CSS.
1. background-image: viz Dan Cederholm: faux columns =falešné sloupce (zagoogli)
2. background-color:
<h1 id="hlavicka">XXXXXXX</h1>
<div id="telo">
<div id="lavyobsah">XXXXXXX</div>
<div id="stredobsah">XXXXXXX</div>
<div id="pravyobsah">XXXXXXX</div>
</div>
<div id="paticka">XXXXXXXXXX</div>
---------------------------------------
#telo {overflow:hidden}
#lavyobsah,#stredobsah,#pravyobsah {
padding-bottom: 22222px;
margin-bottom: -22211px;
}
#paticka {position:relative} /* quli IE */
To Onsi : mrkni na http://css.interval.cz/clanky/trisloupcovy-layout-svaty-gral/

Přidej příspěvek
Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!
Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku
×Vložení zdrojáku
×Vložení obrázku
×Vložení videa
Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×






























































Uživatelé prohlížející si toto vlákno
Uživatelé on-line: 0 registrovaných, 7 hostů
Moderátoři diskuze