Olen kysynyt tästä asiasta tällä palstalla jo aiemmin, mutta otanpa asian jälleen puheeksi.
Miten saan div:in taustakuvan ja itse divin skaalautumaan aina vähintään koko näytön korkuiseksi ja sillällön määrän vaatiessa myös kokonäyttöä korkeammaksi?
Olen määrittänyt div:in korkeudeksi 100%, eli siis kokonäytön korkeuden. Noh... Miten saisin sen tuosta suurenemaan sitten kun sisältöä tulee lisää, sitä en tiedä. Taustakuva on määritelty monistamaan itseään pystysuunnassa (repeat-y) mutta sekin katkeaa siihen 100% kohtaan.
Tässä kuvakaappaus ongelmasta:
http://i16.tinypic.com/2jahx8m.png
Jos jätän div:ien korkeuden määrittelemättä, jolloin oletusarvon pitäisi kai olla "auto", menee kaikki perse edellä puuhun. Koitin myös määrittää "min-height: 100%;" ja siihen perään "heigh: auto;", mutta tämäkin vain sotkee koko sivut.
Kyhäämäni koodi on nähtävillä täällä:
http://www.freewebs.com/bbtw-fi/testi%5Fpohja.txt
ja css-tiedosto:
http://www.freewebs.com/bbtw-fi/testi%5Fweb.css
Kiitos vastauksista!
Miten saan div:in taustakuvan ja itse divin skaalautumaan aina vähintään koko näytön korkuiseksi ja sillällön määrän vaatiessa myös kokonäyttöä korkeammaksi?
Olen määrittänyt div:in korkeudeksi 100%, eli siis kokonäytön korkeuden. Noh... Miten saisin sen tuosta suurenemaan sitten kun sisältöä tulee lisää, sitä en tiedä. Taustakuva on määritelty monistamaan itseään pystysuunnassa (repeat-y) mutta sekin katkeaa siihen 100% kohtaan.
Tässä kuvakaappaus ongelmasta:
http://i16.tinypic.com/2jahx8m.png
Jos jätän div:ien korkeuden määrittelemättä, jolloin oletusarvon pitäisi kai olla "auto", menee kaikki perse edellä puuhun. Koitin myös määrittää "min-height: 100%;" ja siihen perään "heigh: auto;", mutta tämäkin vain sotkee koko sivut.
Kyhäämäni koodi on nähtävillä täällä:
http://www.freewebs.com/bbtw-fi/testi%5Fpohja.txt
ja css-tiedosto:
http://www.freewebs.com/bbtw-fi/testi%5Fweb.css
Kiitos vastauksista!
Vastaukset 2
Vanhimmat
http://www.snook.ca/technical/div_tables/ ja http://www.quirksmode.org/css/display.html
Jos taasen haluat valtaselaimellakin toimivan niin helpoin tuo on tehdä ihan kolmipalstasella taulukolla.
Jos nyt ymmärsin ongelmas oikein niin tässä jotain helpotusta.. Tosin divien avulla heightin määritys 100% sisällön loppues ennen ikkunan alalaitaa on aina ongelmallista. Sun pitää ensinnäkin laittaa noi sun kaikki nykyset divit yhden päädivin sisään. Yleensä tosta käytetään container-nimitystä, vaikka eihän sillä oo välii.. sit laittelet seuraavat jutut css:ään:
html, body { height: 100%; }
#container { position: relative; min-height: 100%; }
* html #container { height: 100%; }