Autor Zpráva
Nosko
Profil *
Zdravím všetkých.Mám problém, s ktorým sa už babrem dva dni a už fakt neviem.Na stranke som si vytvoril layout. Hlavička+telo+pata. Telo som dalej rozdelil na dva stípce(ľavý,pravý) a obsah. A celý problém je v tom že chcem ale neviem, aby sa všetky 3 stípce dotiahli až ku pate. Napríklad ked je lavé menu dlhšie ako obsah aby sa obsah dotiahol až dole a naopak(keď je obsah dlhší...). ďakujem všetkým za vašu pomoc a rady.


html, body {
padding-top: 20px;
background-color: rgb(248,248,248);
}
#page {
margin-left: auto;
margin-right: auto;
width: 900px;
height: 300px;
}
#hlavicka {
width: 100%;
background-color: rgb(169,169,169);
height:40px;
}
#lista {
width: 100%;
height: 30px;
}
#hlavnaobal {
width: 900px;
}
#lavemenu {
width: 20%;
float: left;
background-color: pink;
}
#pravemenu {
width: 20%;
float: right;
background-color: red;
}
#hlavnaobsah {
background-color: rgb(0,204,153);
width: 60%;
float: right;
}
#pata {
width: 900px;
height: 40px;
background-color: rgb(229,229,229);
text-align: center;
}

<body>
<div id="page">
<div id="hlavicka">
Hlavicka
</div>
<div id="lista">
lista
</div>
<div id="hlavnaobal">
<div id="lavemenu">
lave
</div>
<div id="pravemenu">
prave
</div>
<div id="hlavnaobsah">
obsah<br />
</div>
</div>
<div id="pata">
pata
</div>
</div>
</body>
Anonymní
Profil *
Nastav všem třem sloupcům stejnou výšku,
například

#lavemenu {
width: 20%;
height: 800px;
float: left;
background-color: pink;
}
#pravemenu {
width: 20%;
height: 800px;
float: right;
background-color: red;
}
#hlavnaobsah {
background-color: rgb(0,204,153);
width: 60%;
height: 800px;
float: right;


Nemusí to být v px, ale i v %.
Nosko
Profil *
Hej som skúšal ale keď má obsah na výšku viac ako tých x px/% tak text začne prechádzať cez patu :(
Tom@sQo
Profil *
ja mam PRESNE ten isty problem na http://tomasko.wz.cz/testpage.php a neviem si dat rady. skus sa pozriet do zdrojakov na freez.wz.cz alebo na superhry.cz tam to maju nejako riesene, ale ako, na to som neprisiel... resp. som sa nevzsomaril :( ked na nieco prides, napis :)
Tom@sQo
Profil *
add1:btw neze sa zlaknete z toho dizajnu :) pouzil som nan vystredne farby, aby ste videli, ze kde ktory div konci :)
add2: nosko, ja som uz trosku pokrocil oproti tvojmu dizajnu, ale nie ovela :) (mne sa paa dotiahne podla najdlhsieho divu)
tiso
Profil
...to som zvedavý kam to dotiahnete... Všetci traja... Doporučujem hľadať na internete...
Nosko
Profil *
na internete som uz
...to som zvedavý kam to dotiahnete... Všetci traja... Doporučujem hľadať na internete...
Na internete som už pozeral, mi možeš veriť (buď je to uplne niečo iné, alebo proste riešené cez tabulky - a to ja nechcem) A tiso dá sa to vôbec urobiť, alebo je to nemožné ako tu trošku naznačuješ? ;) Budem rád za každú radu. Ď.
tiso
Profil
Nosko
1. Pokiaľ chceš mať stĺpce rovnako dlhé, nastav im rovnakú dĺžku... Inak to nejde.
2. Pokiaľ chceš aby stĺpce vyzerali ako rovnako dlhé, tak to môžeš spraviť buď obrázkom na pozadí, alebo trošku zložitejšie i bez obrázku, ale na odkaz si nespomeniem...
UPDATE: http://www.pixy.cz/blogg/clanky/css-3col-layout/
Tom@sQo
Profil *
huha velmi nerozumiem tomu pixyho kodu :(
Tom@sQo
Profil *
mno, zase som sa trosku pohral s csskom na http://tomasko.wz.cz/testpage.php , ale nanestastie, nedosiahol som ziaden efekt :( prosim pomozte mi, co tam robim zle(co som tam v cssku zabudol dat)?
tiso
Profil
Tom@sQo
Kúp si Pixy-ho knižku a možno porozumieš... Pokiaľ to so stránkami myslíš vážne tak by si sa mal systematicky učiť..
Tom@sQo
Profil *
1) aku knizku vydal? 2) nechce sa mi z toho vysomarit :) som si stiahol zdrojak toho prikladu, trosku ho zjednodusil a pohral sa s html a css, ale este stale tomu nejako nechapem. naco tam dal to main1 a main2 ?
potom som sa pohral s poradim stlpcov, ale som z toho este vacsi jelen jak doteraz(preco zalezi na poradi kodenia stlpcov? ked som ich poprehadzoval, tak sa to pomenilo...).
add: mno zo strankami to myslim vazne, viem kodit v php, viem robit redakcne systemy, ale na htmlko som prikratky :-)
Tom@sQo
Profil *
cssko som prestudoval, pochopil som niektore yaujimave vlastnosti (clear: both :-)), ale stale nechapem, KTORY predpis CSS robi ten samopredlzovaci dizajn vo vsetkych stlpcoch...
Alphard
Profil
http://jezek2.advel.cz/css/3colhf.html
http://www.positioniseverything.net/threecolbglong.html
http://www.pixy.cz/blogg/clanky/css-3col-layout/
tiso
Profil
Tom@sQo
1) http://knihy.cpress.cz/Book.asp?BookCode=K0798 (super kniha)
alebo i http://knihy.cpress.cz/Book.asp?ID=1394 (ešte som nečítal)
2) hold študuj aké vlastnosti sú priradené ktorému prvku, kľudne si zvýrazni jednotlivé div-y zadaním nejakej farby pozadia...
3) Poradie stĺpcov je dôležitá vec, obsahový stĺpec by mal byť čo najvyššie v kóde stránky.
Toto téma je uzamčeno. Odpověď nelze zaslat.