(X)HTML, JavaScript, DHTML, XML, CSS Client scripting tehnologije, Dynamic HTML, Cascading Stylesheets, XML i standardi |
|
Alati teme | Način prikaza |
|
20. 04. 2006. | #1 |
A suicide bomber!
Certified
|
Problem sa layoutom...
treba da iskodiram jedan layout koji nikako nisam uspeo da ubacim u tabele (jer su svi delovi razlicitih dimenzija) pa sam pomislio da to uradim preko lejera ali problem mi je sto bas nisam upoznat sa njima (lejerima). Citao sam nesto na netu o lejerima i video primere ali ni jedan koji pokazuje kako da uradim ovo sto meni treba...
evo slike: zeleni delovi su staticni (ne menja im se velicina) stim sto E i F delovi treba da budu na sredini. Narandzasti delovi se resizuju po horizontali a crveni po vertikali (plavi deo je zapravo mesto gde sadrzaj stranice treba da bude). nisamo mogao ovo da odradim sa tabelama iz razloga sto A, E i C i B, F i D delovi nisu iste visine... i cela stvar treba da bude centrirana i da se siri (po vertikali jer biti fixne sirine) u zavisnosti od sadrzaja. (ma znate vec ) svaka pomoc je dobro dosla. Hvala unapred. poz
__________________
jQuery addict! |
20. 04. 2006. | #2 |
VD IT Direktora
Invented the damn thing
Datum učlanjenja: 08.06.2005
Lokacija: Beograd
Poruke: 2.118
Hvala: 503
1.307 "Hvala" u 282 poruka
|
A što ne probaš sa ugnježđenim tabelama?
Poslednja izmena od jablan : 20. 04. 2006. u 16:25. |
20. 04. 2006. | #3 |
A suicide bomber!
Certified
|
ma probao sam ja sa ugnjezdenim tabelama ali ne ide...
ovaj tvoj kod radi ali je problem sto ne smem da koristim height na tabeli (jer nije po standardu, a kod mora da mi podrzava najmanje html 4.01 standard) evo sta sam ja probao: Kôd:
<table width="900px" border="0" cellpadding="0" cellspacing="0"> <tr> <td style="width: 101px;"> <table border="0" cellpadding="0" cellspacing="0"> <tr><td id="layout_topleft"> </td></tr> <tr><td id="layout_left"> </td></tr> <tr><td id="layout_bottomleft"> </td></tr> </table> </td> <td id="content"> <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td class="layout_top"> </td> <td id="layout_topmiddle"> </td> <td class="layout_top"> </td> </tr> </table> bla bla bla <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td class="layout_bottom"> </td> <td id="layout_bottommiddle"> </td> <td class="layout_bottom"> </td> </tr> </table> </td> <td style="width: 63px;"> <table border="0" cellpadding="0" cellspacing="0"> <tr><td id="layout_topright"> </td></tr> <tr><td id="layout_right"> </td></tr> <tr><td id="layout_bottomright"> </td></tr> </table> </td> </tr> </table> Kôd:
#layout_topleft { width: 101px; height: 244px; background: url(img/frame/top_left.png) no-repeat; } #layout_bottomleft { width: 101px; height: 210px; background: url(img/frame/bottom_left.png) no-repeat; } #layout_left { width: 101px; background: url(img/frame/left.png) repeat-y; } .layout_top { height: 26px; background: url(img/frame/top.png) repeat-x; } #layout_topmiddle { width: 238px; height: 26px; background: url(img/frame/top_middle.png) no-repeat; } .layout_bottom { height: 15px; background: url(img/frame/bottom.png) repeat-x; } #layout_bottommiddle { width: 99px; height: 15px; background: url(img/frame/bottom_middle.png) no-repeat; } #layout_topright { width: 63px; height: 116px; background: url(img/frame/top_right.png) no-repeat; } #layout_bottomright { width: 63px; height: 211px; background: url(img/frame/bottom_right.png) no-repeat; } #layout_right { width: 63px; background: url(img/frame/right.png) repeat-y; } #content { background: url(img/bg/content.png) repeat; background-color: #042942; } hvala na odgovoru ali da nemas neko drugo resenje (da odgovara standardima)?
__________________
jQuery addict! |
20. 04. 2006. | #4 |
Ivan Dilber
Sir Write-a-Lot
|
moglo bi ovo iz CSS-a bez vecih problema, osim za centriranje E i F, to nisam siguran kako da uradim. Moglo bi da se vara pa da se stavi da je 3 i 4 po 50% sirine, a da je E apsolutno pozicionirano preko, ukoliko preklapanje nije problem?
U tom slucaju imas 3 vertikalna div-a, levi i desni su float: left i right, i imaju neku sirinu, a centralni ne mora nista. Onda u levi i desni naprosto ubacis po 3 diva, i oni ce se postaviti kao na slici (A, 1, B i C,2,D). Centralni podelis na gornji, donji i srednji. Gornji i donji treba da su position:absolute; gornji ima top: 0, a donji bottom: 0. Srednjem podesis padding tako da se ne preklapa sa njima. Srednji ti je 7. I sad zadnji korak, u npr. gornji stavis 3 diva, 2 su floatovana levo i desno i sirine 49% (to su 3 i 4), a srednji je apsolutno pozicioniran preko njih na sredini (to je E). Identicno tako i u donjem divu za 5,6 i F.. Ajd ako se ne snadjes, probacu da otkucam ovo, pa da ti dam primer, mada ima tu posla...
__________________
Leadership is the art of getting people to want to do what you know must be done. Poslednja izmena od ivanhoe : 20. 04. 2006. u 20:42. |
21. 04. 2006. | #5 |
Creative Director
Qualified
|
za sta koristis ovakav layout??
|
21. 04. 2006. | #6 | |
A suicide bomber!
Certified
|
Citat:
@ivanhoe: da preklapanje nije problem (3 i 4 koriste istu sliku) tako da cu pokusati ovo sto si rekao (najverovatnije cu samo da koristim jedan div za 3 i 4, to sam podelio na dva dela zbog tabela...) hvala cu javim ako bude bilo problema poz
__________________
jQuery addict! |
|
|
|
Slične teme | ||||
Tema | Početna poruka teme | Forum | Odgovori | Poslednja poruka |
Double float problem - resen, ali ima dodatni problem :0 | ljtruba | (X)HTML, JavaScript, DHTML, XML, CSS | 34 | 23. 08. 2008. 02:28 |