Kelluva navigointipalkki

CSS-asetteluesimerkki

Tämän esimerkkisivun BODY-elementti on jaettu neljään päälohkoon:

body
  |
  |__ Logolohko (div#logo)
  |
  |__ Otsikkolohko (h1)
  |
  |__ Pääsisältölohko (div#sisalto)
            |    
            |__ Navigointilohko (div#navigointipalkki)

Kaikki sivun ulkoasumääritykset löytyvät lähdekoodin STYLE-elementistä.

Nestemäinen layout?

Tällä tarkoitetaan sitä, että kaikki mahdollinen on pyritty määrittelemään suhteellisesti, jotta sivun sommittelu mukautuisi mahdollisimman hyvin erilaisiin tilanteisiin. Voit kokeilla miten sivu mukautuu erilaisiin asetelmiin esim. muuttamalla kirjasinkokoa ja/tai muuntelemalla selainikkunasi kokoa.

Tarkasta tämän sivun tyylien oikeellisuus.