[ tOwk @ 09.09.2002. 13:46 ] @
P: Kako da centriram lejer na stranici koji sadrži i druge apsolutno pozicionirane lejere?

O: Mnogi bi istog trenutka predložili okvire (frejmove) ili tabele. Međutim, nijedno ne predstavlja pravo rešenje (tj. to im nije namena).

Kako se koriste lejeri, to je poželjno koristiti CSS2 mogućnosti: ,,margin-left'' i ,,margin-right''.

Kada se obe ove postave na ,,auto'', sadržaj će biti centriran. Naravno, tada je potrebno koristiti i ,,position: relative'' umesto ,,position: absolute''.

Evo i primera:
Code:

<div style="margin-left:auto; margin-right:auto; width:400; background-color: green; position: relative">
<table border="1">
  <tr><th colspan="3">Tabela</th></tr>
  <tr><th>Cena</th><th>Komada</th></tr>
  <tr><td>Bla, bla</td><td>Di-du</td></tr>
  <tr><td>Ble, blo</td><td>Di-da</td></tr>
</table>
<div style="position:absolute; left:200; top:40; width:300; height:150; background-color: blue">
Oleee
</div>
</div>


Tabela je tu samo da se vidi da njena svrha nije za pozicioniranje, kao i da se može sadržaj ubaciti na uobičajen način.

Napominjem da ovo radi samo u CSS2 preglednicima (Mozilla uspešno prikazuje, ne znam za IE). ,,margin-left'' i ,,margin-right'' su još iz CSS1 (a ni ovo IE5.5 ne podržava), a ,,position'' je iz CSS2.

Da bi naterali centrirani lejer da postane ,,containing-block'' (izraz iz CSS2 specifikacije na http://www.w3.org/TR/REC-CSS2), potrebno je da mu ,,position'' ne bude ,,static''. Izborom ,,relative'' smo to obezbedili.

--

Nažalost, ne funkcioniše u IE-u. (Trunks)

[Ovu poruku je menjao Trunks dana 17.10.2002. u 18:44 GMT]

[Ovu poruku je menjao Aleksandar Vasic dana 17.01.2009. u 01:00 GMT+1]
[ Trunks @ 11.09.2002. 22:54 ] @
P: Kako da koristim latinična slova "ĐŠĆČŽ" na svojoj stranici?

O: Korišćenje "naših" latiničnih slova je jako preporučljivo. Ukoliko se ne koriste, stranica deluje amaterski i nedovršeno.
Dodajte, ukoliko već niste, Serbian (Latin) u language bar (Control Panel : Regional and Language Options : Languages : Details) ili, ako koristite stariju verziju Windowsa -- Slovenian.

U <head> deo svoje stranice dodajte UTF-8 charset. Primer:
Code:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

Posle toga uključite odgovarajući jezik u language baru, i nesmetano koristite sva latinična slova.

Uputstvo za Windows korisnike.
[ BobMarley @ 23.02.2004. 00:32 ] @
P: Kako i što mogu raditi sa popup prozorima ?

O:


1: http://www.elitesecurity.org/tema/42439
2: http://www.elitesecurity.org/tema/43063

Možete naći o:
- otvaranju i zatvaranju popupa
- visini i širini
- poziciji na ekranu
- izgled popupa (sa ili bez address bara, toolbara ... itd.)
- prosljeđivanje parametara u popup
- izvršavanje pojedine akcije po otvaranju ili zatvaranju popupa
[ -zombie- @ 15.04.2004. 18:46 ] @
PRE nego što POČNETE

pre nego što počnete da radite sa CSSom, morate da dobro ovladate host jezikom (domaćinom) na koji će se CSS pravila i stilovi primenjivati. kako je ovo u 99% slučajeva (x)HTML, predlažem da krenete od xHTML dokumentacije.

da bi se vaš CSS pravilno primenio na vaš html, prvo sam html mora biti pravilno struktuiran, ugnježden i ostalo. takođe, korisno je (ne zbog CSSa već zbog drugih stvari) da naučite kada valja koji xHTML tag koristiti..



DOKumentacija, SPECifikacija..

sajt od koga sve počinje http://www.w3.org/Style/ i konkretnije za css http://www.w3.org/Style/CSS/. odgovori na bar 80% problema i vaših pitanja se mogu naći u CSS specifikaciji. ne morate je znati celu napamet, ali bar prođite i upoznajte se sa osnovnim principima kojima se vodi CSS.

minimum preporučenih poglavlja (verzija 2.1 CSS specifikacije): 2, 4, 5, 6, 8 i 9, zatim (ne manje važno, ali) 14, 15 i 16.. (a kad to proučite, možete i celu specifikaciju ;).

ovaj sajt osim specifikacija, sadrži još i dosta textova, objašnjenja, kao i linkova ka mnogim alatima za rad sa CSSom..



skupio sam LINKove razbacane po OVOM forumu..

http://www.alistapart.com/topics/css/
ala je majka, tačka. ;)
osim ovog dela oko css, pošto je ovo i WebStandards forum, pogledajte i ostale članke na www.alistapart.com (XHTML, accessibility, usability). iza ovog sajta stoji ekipa oko zeldmana, pa ako pratite blogove možete i njegov na www.zeldman.com.

http://www.glish.com/css/home.asp
vrlo koristan sajt o CSSu. pored tehnika i tutorijala, ima dosta primera dizajna u 2, 3 i 4 kolona (vrlo često pitanje ljudi koji se odvikavaju od dizajniranja uz pomoć tabela ;)

http://tantek.com/CSS/Examples/boxmodelhack.html
IE box model hack. IE tumači zadane margine, dimenzije (širina, visina) i padding drugačije od ostalih browsera (i od standarda, tj pogrešno). na ovom linku možete naći objašnjenje tog problema, i način kako da ga zaobiđete..

http://www.thenoodleincident.com/tutorials/box_lesson/index.html
još malo o kutijama u CSSu..

http://www.codeproject.com/html/cssbeginner.asp?target=css
css for beginners sa codepoint-a. nije nešto naročito, ali možda nekome koristi..

http://www.westciv.com/style_m...cademy/css_tutorial/index.html
veoma obiman i detaljan tutorijal, sa malo prenatrpanom navigacijom. nisam ga detaljno proučio, ali koleginica Conica se kune u njega.. ;)

http://www.w3schools.com/css/default.asp
css tutorijal na simpatičnom w3schools sajtu (samo ponekad porvršnom ili orijentisanom ka IE browseru).. nisam proučio.

http://hotwired.lycos.com/webm...heets/tutorials/tutorial1.html
css u 5 lekcija od web majmuna ;)

kako da promenim BOJE LINKova? :active i :hover mi NE RADE!!

ovo je vrlo čest problem, jer je lako napraviti grešku ako se ne razume tematika. baš kao što je objašnjeno u specifikaciji, svi CSS selektori imaju "meru određenost" (slobodan prevod) koja određuje prioritet po kome se CSS pravila primenjuju. zato je ponekad bitan redosled po kome navodite css pravila. više informacija na:

http://www.meyerweb.com/eric/css/link-specificity.html
http://archivist.incutio.com/viewlist/css-discuss/16337



koji PROGRAMI za rad sa CSSom?

od wysiwyg programa za web dizajn, najpopularniji (možda i najbolji) Macromedia Dreamweaver ima relativno solidnu podršku za CSS. naročito su primetna poboljšanja bila u verziji MX, a verovatno i u najnovijoj MX 2004 (nisam još probao)..

postoji i bar jedan dobar specijalizovan program za rad sa CSSom, a to je Bradbury-jev topSTYLE. fino programče, napisano u delphiju, neki se kunu u njega, a nekima baš i ne odgovara (meni recimo, mada nemam ništa konkretno da mu prigovorim).



koji BROWSER za rad sa CSSom?

moja preporuka je mozilla firefox. čuo sam da su opera 7 i safari dosta napredovali u podršci za CSS u odnosu na svoje prethodnike (operu 6 i konqueror), ali su gecko-based browseri (mozilla & co) i dalje prvi u podršci za CSS. uz to, na mozilu najčešće gleda kao na referentni browser što se tiče web standarda..

još jedan razlog je i to što za mozilu postoji dosta extenzija (i bookmarkleta) koji pomažu u razvoju sajtova. pretražite i isprobajte malo:

texturizer.net extensions: EditCSS, PNH Developers' Toolbar, Reload Every (dok dizajnirate), Venkman (ako često kombinujete CSS sa JSom), Web Developer, LIveHTTPHeaders (nema veze sa CSSom, ali ako ste već web developer), IE View, itd..

i još malo na mozdev extension room..



BOOKmarkLETs? šta i kako?!?

za uvod u to šta su bookmarkleti pogledajte ovaj članak na sitepoint-u. zatim lepo pročešljajte sajtove kao što su www.bookmarklets.com, www.favelets.com kao i http://www.squarefree.com/bookmarklets/.

ako dobar deo vašeg dana provodite u browseru, oduševićete se.. ako se bavite web razvojem, naročito obratite pažnju na web development bookmarklets (npr test styles, edit styles i ancestors).. kao i na mouseover DOM inspector i topographic page layout.



layout sa TRI KOLONE

vrlo česta dizajn tehnika, koji se obilato radila uz pomoć tabela, a ni sa CSSom nije ništa teže:
http://www.positioniseverything.net/guests/3colcomplex.html
http://www.positioniseverything.net/piefecta-rigid.html
http://glish.com/css/2.asp
http://glish.com/css/3.asp
http://css.maxdesign.com.au/floatutorial/tutorial0916.htm
http://css-discuss.incutio.com/?page=ThreeColumnLayouts
http://www.pixy.cz/blogg/clanky/css-3col-layout/
http://www.webproducer.at/flexible-layout/
http://www.fu2k.org/alex/css/layouts/3Col_NN4_FMFM.mhtml



// to be continued..


[Ovu poruku je menjao Aleksandar Vasic dana 17.01.2009. u 00:34 GMT+1]

[Ovu poruku je menjao Aleksandar Vasic dana 17.01.2009. u 00:50 GMT+1]
[ Marko Bijelic @ 15.04.2004. 22:10 ] @
http://zeldman.com/externals/
Najveća lista resursa vezanih za web standarde, css i interfejs dizajn u globalu; gotovo svi važniji blogovi, ala, accessbility, advocacy, css, dizajn magazini i alati, dešavanja, ma gotovo apsolutno sve.

http://stopdesign.com/also/references/
Odlična kolekcija referenci ka css resursima, člancima, specifikacijama, diskusionim listama...

http://css-discuss.incutio.com/?page=CssHack
Početna destinacija za css hacks

http://www.mezzoblue.com/zengarden/alldesigns/
http://www.csszengarden.com/
Demonstacija moći i ljepote css dizajna ( strogo preporučeno ;)

http://www.cssvault.com/
Još malo o prirodnim ljepotama css-a

http://www.webstandards.org/
Advocacy & Education, nije na odmet da se posjeti

http://www.accessify.com/tools.../list-o-matic/list-o-matic.asp
List-o-matic, super onlajn alatka za kreiranje css navigacije (dž, ofkors)

http://www.bluerobot.com/web/layouts/
Layouts edukativnog karaktera, isključivo za otuđivanje

http://zeldman.com/
Vrijedi napomenuti još jednom, centralna lokacija za sve aktuelne informacije o CSS-u i Web standardima




[Ovu poruku je menjao -zombie- dana 24.05.2004. u 21:03 GMT]
[ Cube4EVER @ 22.05.2004. 23:15 ] @
Nemogu da verujem da je neko ovo zaboravio;Cista umetnost!
Link je: www.csszengarden.com
Uzivajte!
[ Ilija Studen @ 01.06.2004. 15:01 ] @
www.s7u.co.uk
[ sEaGhOsT @ 25.02.2005. 10:46 ] @
Topla preporuka:
http://css.maxdesign.com.au/
[ adelante @ 14.04.2005. 19:52 ] @
http://www.stunicholls.myby.co.uk

I ovaj je odlican
[ vejin @ 29.07.2005. 13:14 ] @
Da li moze koji link na nasem jeziku.vidim da ovo nije sala i da se valja nauciti.
[ IT_DooX @ 06.09.2005. 17:38 ] @
Citat:
vejin: Da li moze koji link na nasem jeziku.vidim da ovo nije sala i da se valja nauciti.


Ja sam poceo da prevodim tutoriale sa www.w3.org sajta ali to dosta sporo ide i da ih ubacujem na moju stranicu.I samu stranicu radim u html i CSS koristim.Uvek i u svemu koristim CSS jer mi je mnogo lakse sve,dok nisam njega koristio mnogo sam se patio sa izgledom sajta,sada sam prezadovoljan.Iz tog razloga sam i poceo da prevodim te neke tutorijale koje cu uskoro i postaviti na web page.Doduse nece biti nista specijalno,samo ono sto oni imaju tamo,ali i to je nesto,meni je w3.org posluzio kao referenca da naucim CSS.Ako neko zeli da ucestvuje u prevodjenju i postavljanja tutoriala i stranica na nas jezik neka mi se javi.Ili organizujte to sami.Ja nemam znanje da napravim tutoriale sam pa zato moram da ih prevodim.
[ JimRainor @ 02.10.2005. 11:47 ] @
Vidim da ste zaboravili albinoCrnu ovcu. Veoma dobar tutorial, iako zahteva nekakvo predznanje:
http://www.albinoblacksheep.com/livedesign/
[ jablan @ 14.01.2006. 23:21 ] @
Dosta korisnih informacija o veb dizajnu i veb programiranju na srpskom na:

http://svezaweb.dzaba.com/
[ nesa0 @ 12.03.2006. 23:17 ] @
Nekoliko tutorijala na srpskom
http://www.cet.co.yu/r_teme.htm
[ jablan @ 17.03.2006. 15:05 ] @
P: Kako da mi se isti tekst (npr. meni) pojavljuje na svim stranicama, a da ne moram ručno da ih editujem i ubacujem?

O: Korišćenjem neke od sledećih tehnika:
1) Server Side Includes http://en.wikipedia.org/wiki/Server_Side_Includes
2) PHP, ASP ili neki treći serverski skripting jezik (konsultovati odgovarajuće forume na ES i http://www.php.net)
3) Frejmovi ili IFRAME-ovi (konsultovati neki priručnik za HTML)
itd.

Takođe pogledati npr.
http://www.elitesecurity.org/tema/83882



P: Kako da na svoj sajt dodam komentare (anketu, brojač poseta), a da ne koristim gotove servise sa drugih sajtova?
O: Nažalost, za ovo morate koristiti neki program na serverskoj strani. Najčešće se koriste PHP i ASP (http://www.php.net http://www.elitesecurity.org/forum/12), za koje postoji već brdo gotovih rešenja na Internetu (http://www.hotscripts.com/)

Takođe pogledati npr.
http://www.elitesecurity.org/tema/25528



P: Da li je pametno da postavim ulaznu stranicu (splash screen), ili da korisnici na sajt ulaze direktno?
O: Pogledajte sledeću temu: http://www.elitesecurity.org/t...s-sajt-direktno-ili-prvo-enter

[Ovu poruku je menjao jablan dana 05.05.2006. u 12:06 GMT+1]
[ bantes9 @ 10.02.2007. 21:28 ] @
http://www.alistapart.com

Dosta clanaka vezanih za web dizajn, ali na engleskom jeziku.
[ djyova @ 04.03.2007. 01:53 ] @
Da li neko ima link gde moze da se skine fajl sa svim css komandama? Znaci ne tutorijal vec jednostavno popis svih mogucih komandi.
[ Error404 @ 13.03.2007. 22:17 ] @
http://numbersandshapes-design.blogspot.com/
ima i css tutoriala na srpskom i svasta jos a ako vam nesto nije jasno mozete slobodno i da pitate - komentari su dozvoljeni za sve
[ toplim @ 02.12.2007. 17:37 ] @
Ako trazite tutoriale na "NAŠEM" jeziku mislim da postoji jedno fino mesto za to. I ono sto je vazno prvo sve lepo skinete pa citate. Ima puno stvari o web dizajnu pored ostalog...

http://tutoriali.org

Ali morate prvo da se registrujete. Verujte mi isplati se.
[ Aleksandar Ružičić @ 12.10.2008. 18:01 ] @
P: kako da centriram element (div) po vertikali?

O: http://www.jakpsatweb.cz/css/css-vertical-center-solution.html
[ Nemke_BG @ 16.12.2008. 11:21 ] @
Evo ljudi trazeci nesto o razlikama u css-u medju browserima naisao sam na ovo, nije lose odradjeno i u kombinaciji sa http://www.positioniseverything.net/ dobro dodje...

http://www.quirksmode.org/css/contents.html
[ Aleksandar Ružičić @ 16.12.2008. 13:36 ] @
quirksmode je glavna destinacija ako vas interesuju razlike u browserima, bilo u css podrsci, javascript ili html. svi ostali kopiraju ppk-a :)
[ Nemke_BG @ 16.12.2008. 14:49 ] @
tu si manje vise u pravu......a evo i ovo moze da bude veoma korisno ako zatreba......mislim sam naziv url-a sve govori...

http://webbugtrack.blogspot.com/