Pomoč pri css

bottom ti vzame od cele strani spodaj, ker imaš div direktno na stran napisan. Kaj hočeš narest je, da imaš par wrapperjev okoli divov.

Npr. 1 div header, ok. Pol 1 wrapper, ki je relativen npr. 600px znotri katerega je main content npr. 400px kot si narisal sivo, zgornji črni kvadrat je potem absolutno na relativni in bo recimo top:20px od wrapperja in ne. Črni poln kvadrat na desni pa je potem absolute npr. top:60px bo vzelo od wrapperja, in dodaš še right: 0px, da bo od desne strani se začelo. Cel wrapper maš lahko margin:0 auto, da bo na sredi.

Desni črna obroba meni, narediš float right, relative, pri čemer lahko rečeš top: npr. 100px; tokrat ti bo vzel od cele strani odmike. Enako lahko narediš na levi strani.

Torej lekcija: absolutna pozicija se računa glede na celo stran, možnost, je da narediš si "wrap" element div class="wrap" /div in znotraj njega dodaš dodatne div oz dom elemente. Na ta način se naslednje absolutne pozicije gledajo glede na zgornji nadrejeni div.

Včasih lahko wrapperji tudi tepejo, npr. pri tebi ni dobra ideja narest 1ga absoultnega wrapperja, ker imaš header daljši kot potem notranji content in se ti bolj splača razdelit na par delov in potem znotraj tega gledati. Ena stvar, ki se jo hočeš izogibati, če je možno je absolutna pozicija v negativne px..

http://cssdeck.com/t/b9heczyo/1

Fora je, da to kar si si zbral z takšnimi odmiki se ponavadi ne dela. oz. razmišljat moraš v škatlah. kako jih boš postavil in katera se bo nanašala na katero. to kar sem ti napisal je ena rešitev. eno kar recimo se izogibaj je, pozicioniranje elementov glede na bottom. namreč, ko boš enkrat imel notri realna besedila recimo novice so le-te ponavadi različno dolge in od spodaj gor ne veš višine, od zgoraj dol pa veš.

Ful hvala. Ampak kakšna je razlika med margin: 0 auto; in margin: auto;? Je to isto ali je kakšna fora? Pravtako nevem točno kot sem rekel absolute in relative elementa. Zdaj si naredil brez absolute.
Ne razumem pa kaj si hotel reči da moram razmišljat o škatlah...saj to so škatle. Kolikor sem pa z firebug-om gledal pa spletne postavijo z tabelami (tbody, td, tr,...), si to mislil?

Se opravičujem, nevem kako se je to zgodilo, kliknil sem samo 1x na pošlji poslalo mi je pa 1 preveč

tabele uporabljaj samo za tabularne podatke, torej tabele so your friend, ko imaš dejansko tabelo :)

ne vem kako nej razložim relative absolute. bom probal. torej html dom elementi se izrisujejo od začetka proti koncu, torej kar napišeš prej se bo prej izrisalo. vsi elementi so v osnovi relativni na kanvas (to je browser window).. daš škatlo gor in če nič ne nastaviš bo levo zgoraj. lahko ji rečeš margin 0 auto in bo zgoraj brez odmika, levo desno pa avtomatično (pazi catch, mora imeti fiksno širino, če želiš, da to dela).
potem imaš naslednji element, le-ta se bo izrisal za naslednji element.

naslednja stvar, ki si jo preberi so: display: block/inline/compact; ta parameter opisuje izris škatel na kanvasu, če je zadeva block bo izrinila vse elemente vzporedno z njo, inline bo štancala elemente zraven, compact tudi itd. vsaka se malo drugače obnaša.

potem imaš float: left/right. naredi to kar piše, element se postavi čisto levo ali čisto desno, + vsi naslednji elementi sledijo temu pravilu. če ga hočeš resetirati, da bo zopet block torej pod tvojo škatlo moraš narediti clear: left/right/both; odvisno kaj imaš.

malo sem zašel. ampak to so v osnovi vse opcije, ki se izvajajo zraven relativnih objektov + seveda še druge.

na drugi strani imaš position absolute. tega si predstavljaj kot koordinatni sistem. levo zgoraj je tvoja 0, 0 točka in začetek sistema. potem vzameš element/škatlo in jo postaviš top:20px, left: 60px; in tada je odmaknjena za toliko. pri absolute lahko določiš 1 parameter, ponavadi je pa najbolje 2 - tista ki določiš torej top/bottom/left/right tja se bo nalepil element. - torej če boš napisal top:20px, bottom 30px; bo vzel bottom ker je kasneje v sintaksi, da te ne bo medlo - uporabljaj samo enega.

zdej pa še catch. če imaš element 1, ki je relativen in znotraj tega elementa element 2, ki je absoluten, bo le-ta absoluten na element 1. če ga želiš, da je absoluten na kanvas ga ali daš ven iz elementa, lahko pa tudi ne določiš relativnosti elementu 1.

hmm. malo sem se razpisal. torej lekcija naprej. poglej si še display / float / position in se malo igrej ;)