[CSS] Pravljenje layouta

[EclipsE]

Dakle, u photoshopu sam napravio izgled sajta koji mozete videti:



E sad, ja mogu da u dreamweaver-u da pravim table-ove gde ce se shta nalaziti, ali znam da moze i preko CSS-a da se odradi, e sad, kako??
unapred hvala

[Remedy]

Moze da se uradi pomocu CSS-a, ali ti je pitanje previse uopsteno. Ako ne znas css, onda je www.htmldog.com dobro mesto za pocetak (nadji knjigu, nije tesko). Ako znas, ti kreni pa kad negde zapne pitaj. Neces moci da koristis transparentne .png jer ih ie6 ne podrzava (il da pravis poseban layout za ie 6), ali moze da se izvede i bez njih.
Evo sta sve moze da se izvede pomocu css-a csszengarden. U pitanju je isti html fajl, a svaki autor je uradio drugaciji dizajn pomocu css-a. Ima ih preko 200 .

[EclipsE]

Znam ja CSS... onako nikad nisam radio layout pa mi to predstavlja problem, ne znam shta i kako ali vidim da ima na html dog-u nekih tutorijala pa cu ja to da sve prostudiram

[EclipsE]

zapeo sam malo... samo jedna stvar me muchi, znachi ovako: gornji deo sam odradio, i doshao je na red donji deo - levi deo za novije tutorijale, i desni deo za content... levi deo float-ujem levo, desni deo float-ujem desno, footer clear:both;, ok nije problem... problem je u tome shto sadrzaj moze da bude veci pri velikoj rezoluciji, a pri manjoj bi trebalo da se smanji... na trenutnoj 1152x864 izgleda lepo, ali na 1024x768 sadrzaj se proshiri, a to ne valja... ima nekih ideja??

[Remedy]

Ti bi hteo liquid layout, kao na htmldog-u . Aj stavi slike - kako izgleda kad je ok, i tu koja nije kako treba - ne kapiram bas najbolje sta je problem (tj sta se ne smanjuje).

[EclipsE]

u medjuvremenu sam promenio izgled sajta, ali nema veze... evo kako izgleda pogreshna verzija



a evo kako izgleda pravilna



problem nastaje kada mi sadrzaj floatuje desno, i zalepi se za desnu stranu... sirina sadrzaja se menja, i pri vecim rezolucijama, pravi se praznina izmedju login forme i sadrzaja... hteo sam da ove nove tutorijale stavim kao position: absolute:, ali nisam smeo jer onda nece raditi za footer clear:both;, tj. novi tutorijali bi prelazili preko footer-a u slucaju da je sadrzaj koji se gleda mali...

[Remedy]

Pa sad, ne znam tacno kako si uradio kod, ali probacu. Prvo sto mi pada na pamet je da si ovom div-u koji je float-ovan desno stavio levu marginu odredjene sirine - u pikselima npr. pa kad se "skupi" margina ostaje iste sirine, a sirina ovog levog dela je npr u % pa se on skupi kad smanjis prozor. (leva margina ti ne treba ako si ga floatovao desno, samo ako nisi a imas levi float onda ti treba).
Sto se tice clear-ovanja float-a, ima jedna bolja fora. Stavi levi i desni div u jedan zajednicki kontejner div. Tom kontejneru daj overflow: auto; Onda neces morati da u footeru koristis clear: both; , a kontejner div nece da se "skupi" (u ie6 se ne bi skupio ni bez overflow: auto; ali to je bug ie6). Ako ti ovo skupljanje nije jasno, stavi neki background-color kontejneru (razlicit od levog i desnog diva), pa probaj sa i bez overflow: auto; (nemoj samo u ie6).
Sto se tice ovoga sa position: absolute; to mozes komotno da uradis ako ce ti levi div na svakoj stranici biti kraci od desnog. Onda desni ne treba da floatujes, samo mu stavi levu marginu iste sirine kao levi div.
Ako ti nista od ovoga ne pomaze, okaci kod tog dela da vidim.