beats by dre cheap

Kako vertikalno centrirati <div>?

Zasigurno je već svima poznato kako W3C, doduše odavno, al u posljednje vrijeme sve više ne preporučuje korištenje tabela pri izradi izgleda stranice. Tabele su vam omogućavale da na jednostavne načine napravite izgled vašeg HTML dokumenta sa neograničenim brojem kolona i redova, te za razliku od layera, nisu vas ograničavale pri vertikalnom poravnanju. Znači vrlo lako se mogao podesiti bilo kakav vertikalni [i]alignement[/i] u bilo kojoj ćeliji. Ali, danas pošto napokon, dolazi vrijeme stranica koje svoj dizajn ne grade na tabelama, što donosi mnoge prednosti, već na divovima - [i]tableless[/i], postoje i mnoga ograničenja koja vam ne omogućavaju da radite ono što ste radili sa tabelama. Jedno od njih je i nepostojanje vertikalnog poravnanja, tj. [i]alignementa[/i]. Da skratimo priču, i pređemo na današnji savjet. Dok mnogi pokušavaju da vertikalno centriraju

pomoću javascripta, ljudi su se dosjetili jednog drugog dosta jednostavnijeg i bezbolnijeg riješenja. O čemu se radi? Napravite jedan
i nazovite ga "kontejner". Unesite u njega neki tekst i to je sve što trebate napraviti u HTML dokumentu. [b]Znači HTML kôd treba da izgleda ovako:[/b] [pre] Vertical alignement
Lorem ipsum dolor sit amet...
[/pre] Sada možete početi pisati CSS. Što se tiče CSS-a, vertikalno poravnanje se postiže tako što se
#kontejner pozicionira apsolutno, te mu se podese atributi [i]left[/i] na 50% i [i]top[/i] na 50%. Zatim se tom divu moraju dodati negativne margine s lijeve i gornje strane. Numeričke vrijednosti margina moraju iznositi polovinu širine (za lijevu marginu), i polovinu visine diva (za gornju marginu). [b]CSS treba da izgleda ovako:[/b] [pre]body { font-family: verdana; font-size:10px; color: white; background-color: #003; margin: 0px; } #kontejner { background-color: #f00; margin-top: -35px; margin-left: -150px; position: absolute; top: 50%; left: 50%; width: 300px; height: 75px; }[/pre]

CSS
http://css.blogger.ba
05/12/2004 23:04