View previous topic :: View next topic |
Author |
Message |
Sulien
Joined: 04 Jan 2004 Posts: 2905 Location: Zagreb
|
Posted: 25.12.2004 03:10 Post subject: mi3dot bez tablica - right here :) |
|
|
Daklem, ovo bi bio moj božićni poklon našem Dimitriju i svima vama... Budući da se toliko navlačimo sa tim CSS-om na forumima, raspravljamo o korištenju tablica ili css-a, prepucavamo se tko što može i tko što zna, kakvih hackova ima i da li se uopće isplati (a i žao mi je što se ne priča o accessibility-u previše), prezentiram vam ovo kao polu-dokaz i ohrabrenje svima što se tiče korištenja css-a.
Prezentiram vam Dimitrija samog (točnije, jednu stranicu - galeriju) kompletno u CSS-u. Tables thrown out the window Interesiralo me da li se može, kako će izgledati, koliko će biti manji itd. The result is here:
Ne vjerujete? CTRL+SHIFT+D ako imate Developer Toolbar
Ni ja više nisam znao koji je koji kad sam radio zadnje preview-e
Report:
Code: | Browser friendliness: testirano u Firefoxu, IE/Win 6 prolazi koliko toliko
Netscape, Opera, Safari: nemam ih... sorry :(
IE 5.x: nemojte ni pokušavati - to će biti užas
IE 6: naći ćete neke ružnoće, pogotovo na pozadini 'featured' radova... blame M$, not me
Size reduction: veličina html-a smanjena na manje od trećinu, CSS se povećao za svega 2KB
CSS level: bio bi level 1 da nije dva elementa koja imaju apsolutno pozicioniranje
mi3 banners: apsolutno sam ih pozicionirao u dno gdje originalno i jesu, no ipak, ova metoda je skroz glupa i ne preporučam je... ako netko zna bolje, neka mi pliz javi
Hack count: 2
razlog: izbjegavao sam hackove sve do samog kraja kad sam bio prisiljen napisati *dvije* linije posebno za IE6 da se ipak potpuno ne raspadne
Accessibility: morao sam napraviti par sitnih kompromisa kako bih zadržao originalan izgled dimitrija, što je bio prioritet... Najviše pljujem po accessibility-u što i dalje koristim 11px fixni font - ali vjerujte, drugačije nije moglo, barem ne u ovom slučaju... Unatoč svemu vjerujem da je sajt sada prilično accessible, prolazi većinu točaka 508 i wcag-aaa, a ostale neću ispravljati jer je ovo samo test
Hours spent: many... dva dana rada (uglavnom prepisivanje sadržaja, c&p doesn't quite cut it from tabled layout :) |
Eto Svi komentari su poželjni, svaka primjedba dobrodošla. Volio bih vas moći ohrabriti da naučite nešto iz ovog CSS-a, ali toliko se na kraju izdužio da će ga samo oni najuporniji (i najmazohističniji) moći stvarno proučiti... Inače, elementi se u CSS-u pojavljuju kako dolaze i u HTML-u, to možda malo olakša stvar.
I da... Merry xmas |
|
|
Back to top |
|
|
emptyhead mi3.crew
Joined: 03 Sep 2003 Posts: 889 Location: Daleko od Novog Zelanda
|
Posted: 25.12.2004 03:32 Post subject: |
|
|
THX!
Genijalno, ali... (ovakav pocetak recenice obozavam... )... saxa u IE6 kao sto si i napisao - ne tolko kolko u ie5 al ipak je neiskoristivo ko cjelina.
Ono sto je najvise mrak je to sto si vjerojatno bacio rukavicu u lice ostatku css bulterijera i mahaca rukama i da ce na kraju se mi3 prebacit kao "open source css" projekt ... erm... u css skroz .
Jos jednom, svaka cast na trudu, hrabrosti i rezultatu!
|
|
|
Back to top |
|
|
Peewee
Joined: 12 Jan 2004 Posts: 711 Location: Velika Gorica
|
Posted: 25.12.2004 03:41 Post subject: |
|
|
je ti se seksualni zivot poboljso nakon ovog?
trebo bi sigurno!!!
svaka ti dala....
zakon su teme na forumu |
_________________ Pi (Pee) is a mathematical constant equal to approximately 3.14.
zivili!!! |
|
Back to top |
|
|
identity
Joined: 08 Mar 2004 Posts: 16 Location: Zagreb
|
Posted: 25.12.2004 06:55 Post subject: |
|
|
brawo majstore!
Cak sam sad nesto od tebe naucio ..
ja se vec jedno vrijeme zajebavam sa css-om za jedan malo poveci site - portal ... tako da te u potpunosti kuzim .. u svakom slucaju brawo. |
|
|
Back to top |
|
|
ante
Joined: 09 Oct 2003 Posts: 255 Location: st
|
Posted: 25.12.2004 10:39 Post subject: |
|
|
"1450 registriranih i jedan gost (looser " |
|
|
Back to top |
|
|
F@NTOM
Joined: 11 Sep 2003 Posts: 592 Location: Dubrovnik
|
Posted: 25.12.2004 11:06 Post subject: |
|
|
Svaka cast!
Dobio sam tolko nadahnuce da i ja nest ovako napravim.
You d man! |
_________________ These pretzels are making me thirsty! |
|
Back to top |
|
|
Sulien
Joined: 04 Jan 2004 Posts: 2905 Location: Zagreb
|
Posted: 25.12.2004 11:58 Post subject: |
|
|
emptyhead wrote: | ...ali saxa u IE6 kao sto si i napisao... |
Ako treba dokazati da se može sredit, mogu probat
Sad nisam jer, rekao sam, ne volim hackiranje
Mene zanima da li se drži u Opera/Safari |
|
|
Back to top |
|
|
maratz mi3.crew
Joined: 24 Nov 2003 Posts: 1207 Location: ZAG
|
Posted: 25.12.2004 12:28 Post subject: |
|
|
emptyhead wrote: | Ono sto je najvise mrak je to sto si vjerojatno bacio rukavicu u lice ostatku css bulterijera i mahaca rukama i da ce na kraju se mi3 prebacit kao "open source css" projekt ... erm... u css skroz . |
Ma nemrem vjerovat zar na praznik??!!1
Sulien wrote: | Ako treba dokazati da se može sredit, mogu probat
Sad nisam jer, rekao sam, ne volim hackiranje |
Dokazao si well enough. Prvo što bi trebalo popraviti je promjeniti <hr/> u <hr />, a nakon toga kompletno izbaciti <hr /> Pošto je Krismas -- clearanje floata se radi definiranjem floata za parent element, dakle umjesto Code: | .nutra { float: left; }
<div class="vani">
<div class="nutra">
</div>
<hr /> <!-- <br /> or similar trendy shit -->
</div> | treba Code: | .vani { float: left; }
.nutra { float: left; }
<div class="vani">
<div class="nutra">
</div>
</div> | , pa će ovaj 'nutra' širiti ovog 'vani'
Nemoj se toliko zamarati prilagođavanjem, nego još malo popravi sve to skupa za FF. Npr. puca kod resizeanja slova.
Sulien wrote: | Mene zanima da li se drži u Opera/Safari |
Ne, a vjerovatno ne radi niti na IE5.2 |
_________________ STOP HITTING YOURSELF! | NETIQUETTE | TYPETESTER | Hypertext rulez™ | CREATIVE NIGHTS | ACCOMMODATIONS |
|
Back to top |
|
|
vedran
Joined: 08 Sep 2003 Posts: 458
|
Posted: 25.12.2004 13:21 Post subject: Re: mi3dot bez tablica - right here :) |
|
|
Sulien wrote: | Daklem, ovo bi bio moj božićni poklon našem Dimitriju i svima vama... |
Respect |
_________________ http://www.hocusvojweb.com |
|
Back to top |
|
|
Sulien
Joined: 04 Jan 2004 Posts: 2905 Location: Zagreb
|
Posted: 25.12.2004 13:22 Post subject: |
|
|
marac wrote: | dakle umjesto Code: | .nutra { float: left; }
<div class="vani">
<div class="nutra">
</div>
<hr /> <!-- <br /> or similar trendy shit -->
</div> | treba Code: | .vani { float: left; }
.nutra { float: left; }
<div class="vani">
<div class="nutra">
</div>
</div> | , pa će ovaj 'nutra' širiti ovog 'vani' |
HR-ovi nisu za clear Ali jedan paragraf ("All clear") i jedan list item ( ) jesu, probat ću ovo tvoje - thnx
Quote: | Nemoj se toliko zamarati prilagođavanjem, nego još malo popravi sve to skupa za FF. Npr. puca kod resizeanja slova. |
Pokušao sam, ali ne može se sve do beskonačnosti... No, dva puta se ipak može povećati font da layout ostane skupa, nakon toga se naravno raspadne kad svaki drugi element brejka iz svog containera - čak i da se ne raspadne, ne bi više bilo čitljivo
Najnezgodnije sređeni elementi su, naravno, radovi (thumbovi uz informaciju ispod) - bilo bi jednostavnije da nisam htio paziti kako bi to izgledalo bez css-a (text-based browseri), ali budući da jesam kombinirao sam spanove i divove tako da je css na tom dijelu dosta kompliciran, npr. IE totalno poludi sa marginama (smanjio ih prvim hackom) a vjerujem i drugi browseri |
|
|
Back to top |
|
|
Ivan Brezak Brkan
Joined: 13 Sep 2003 Posts: 1694 Location: Zagreb // Croatia
|
Posted: 25.12.2004 14:37 Post subject: |
|
|
Bravo Mislave!! Mislim, lud si ko šiba ali volimo te mi svi ma kakav bio ^^ |
|
|
Back to top |
|
|
ars
Joined: 19 Feb 2004 Posts: 1444 Location: splite moj
|
Posted: 25.12.2004 14:40 Post subject: |
|
|
Fortius wrote: | Bravo Mislave!! Mislim, lud si ko šiba ali volimo te mi svi ma kakav bio ^^ |
|
|
|
Back to top |
|
|
njava mi3.crew
Joined: 25 Aug 2003 Posts: 624 Location: Zagreb
|
Posted: 25.12.2004 14:42 Post subject: |
|
|
emptyhead wrote: | Ono sto je najvise mrak je to sto si vjerojatno bacio rukavicu u lice ostatku css bulterijera i mahaca rukama |
gg sulien! |
|
|
Back to top |
|
|
zweistein
Joined: 14 Nov 2004 Posts: 57 Location: Pula, HR
|
Posted: 25.12.2004 14:57 Post subject: |
|
|
Eeeeeerm... Massive respect i nek' ti za ovo ispod bora osvane nešto jaaaaaako lijepo . Lud lud lud lud . |
_________________ The only laws of matter are those our mind must fabricate,
and the only laws of mind are fabricated by matter. -- James C. Maxwell
Indiscipline - hrvatski site posvećen King Crimsonu! |
|
Back to top |
|
|
kelso
Joined: 19 Jul 2004 Posts: 507 Location: Zagreb -> Zapruđe
|
Posted: 25.12.2004 16:58 Post subject: |
|
|
Svaka čast! |
_________________ Don't drop it! |
|
Back to top |
|
|
random
Joined: 30 Jul 2004 Posts: 58 Location: Ri
|
Posted: 25.12.2004 17:14 Post subject: |
|
|
Peewee wrote: | je ti se seksualni zivot poboljso nakon ovog?
trebo bi sigurno!!!
svaka ti dala....
|
|
|
|
Back to top |
|
|
Sulien
Joined: 04 Jan 2004 Posts: 2905 Location: Zagreb
|
Posted: 26.12.2004 13:38 Post subject: |
|
|
Peewee wrote: | je ti se seksualni zivot poboljso nakon ovog?
trebo bi sigurno!!! |
Ne, pogoršao se
Ne kužim, zar ne vrijedi ono "chicks dig CSS" |
|
|
Back to top |
|
|
/dev/null
Joined: 22 Dec 2004 Posts: 144
|
Posted: 26.12.2004 13:48 Post subject: |
|
|
Malo se ovaj CSS ne voli sa operom 7.54, ne da ga ne renda dobro nego je malo reci... |
|
|
Back to top |
|
|
djuk17
Joined: 06 Oct 2004 Posts: 45 Location: Nepoznata :-)
|
Posted: 26.12.2004 15:38 Post subject: |
|
|
Respect |
_________________ LUV 4 DA GAME |
|
Back to top |
|
|
bozob
Joined: 07 Mar 2004 Posts: 378 Location: Gruda, Konavle
|
Posted: 26.12.2004 16:11 Post subject: |
|
|
nAhSud wrote: | Respect |
|
|
|
Back to top |
|
|
aesqe
Joined: 18 Sep 2003 Posts: 48 Location: zagreb
|
Posted: 26.12.2004 16:20 Post subject: Re: mi3dot bez tablica - right here :) |
|
|
opera (8 beta i 7.23) - manje vise izgleda dobro, par sitnica je mozda drugacije alignano ali to ne utjece na cjelinu, tako da sve izgleda "k'o pravo"
ie6 (xpsp2) - ja vidim samo dva problema: ne prikazuje se pozadina ispod prvog reda "izdvojeno" i "pretrazi" box se nakon loadanja stranice cini raspadnut, a onda se sam sredi (?). sve ostalo mi je ok.
ovo gore sve na 'od oka' procjeni, nisam htio bio picajzla
mac nemam, ali ak se netko moze sjetit onog sajta za testiranje prikaza u raznoraznim browserima... ?
svaka cast, sulien! odlican posao |
_________________ -_-_-_-__oops, missed one-_-_--again_-
::skyphe:: : ::breed:: |
|
Back to top |
|
|
Sulien
Joined: 04 Jan 2004 Posts: 2905 Location: Zagreb
|
Posted: 26.12.2004 18:47 Post subject: Re: mi3dot bez tablica - right here :) |
|
|
/dev/null wrote: | Malo se ovaj CSS ne voli sa operom 7.54, ne da ga ne renda dobro nego je malo reci... |
aesqe wrote: | opera (8 beta i 7.23) - manje vise izgleda dobro, par sitnica je mozda drugacije alignano ali to ne utjece na cjelinu, tako da sve izgleda "k'o pravo" |
e sad... tko je u pravu?
vidim da ću ubuduće morat imat instalirano što više browsera ako hoću radit nešto ozbiljno, neću uvijek moći pitat vas za feedback
Quote: | mac nemam, ali ak se netko moze sjetit onog sajta za testiranje prikaza u raznoraznim browserima... ? |
e, da, pliz |
|
|
Back to top |
|
|
Peewee
Joined: 12 Jan 2004 Posts: 711 Location: Velika Gorica
|
Posted: 26.12.2004 19:37 Post subject: |
|
|
Sulien wrote: | Peewee wrote: | je ti se seksualni zivot poboljso nakon ovog?
trebo bi sigurno!!! |
Ne, pogoršao se
Ne kužim, zar ne vrijedi ono "chicks dig CSS" |
coece ja sam dobio samo zato jer sam to vidio i reko da te znam s foruma |
_________________ Pi (Pee) is a mathematical constant equal to approximately 3.14.
zivili!!! |
|
Back to top |
|
|
maratz mi3.crew
Joined: 24 Nov 2003 Posts: 1207 Location: ZAG
|
|
Back to top |
|
|
Sulien
Joined: 04 Jan 2004 Posts: 2905 Location: Zagreb
|
Posted: 29.12.2004 18:06 Post subject: |
|
|
@peewee:
@marac: whee! |
|
|
Back to top |
|
|
|