Elementin esitystapa: display
Elementin yleisen esitysmuodon määrää sen display-ominaisuus, joiden tärkeimmät muodot ovat block ja inline.
...
display-elementin käytöstä: http://raulihaverinen.fi/varasto/hy2007k/luento3_css.html
CSS-asemoinnin perusteet
CSS-asemointi on elementtien sijoittelua verkkosivulle tiettyjen sääntöjen mukaan. Yksinkertaisimmillaan lohkoelementit asetellaan allekkain ja sisäelementit samaan tapaan kuin sanat kappaleessa, eli peräkkäin.
...
* top
* right
* bottom
* left
Asemointia voi tehdä
Staattisesti (oletusarvo)
Absoluuttisesti: elementin sijainti asetetaan suhteessa johonkin koordinaatistoon (joko sivun vasempaan yläkulmaan tai suhteessa sisimpään asemoituun elementtiin, jonka sisällä ollaan)
...
| No Format |
|---|
#elementti {
position:relative;
}
|
Kelluva asemointi
Asemoinnin vaihtoehtoina on myös kelluva sisältö, joka tehdään float-elementillä. Kelluva elementti sijoittuu joustavasti sivun muun sisällön vasemmalle tai oikealle puolelle.
...
| No Format |
|---|
<div style="clear:both"></div> tai <p style="clear:both"></p> |
Linkkejä
Selkeä tutorial kelluvan css-asemoinnin tekoon
Esimerkkejä:
http://communication.utsa.edu/mbatch/3413/layoutexamples.html
Sivujen taitto kokonaisuutena: kiinteä vai mukautuva taitto?
Taulukkotaitosta kiistellään paljon verkkosuunnittelijoiden parissa. Osa haluaa leimata sen vääräksi, koska layoutin voi nykyisin tehdä myös CSS-asemoinnilla. Jos taitto tehdään CSS:llä, sivuston rakenne ja ulkoasu erottuvat omiksi kokonaisuuksikseen.
Taulukkotaittoa on hyvin monenlaista, ja sen voi tehdä käyttäjän kannalta helpolla tai vaikealla tavalla. Yksinkertaisessa taitossa tieto vian jaetaan kahteen sarakkeeseen, ja monimutkainen taitto voi sisältää monia sisäkkäisiä soluja, joista osa on tehty ulkoasun vuoksi (kuten tyhjän tilan luomiseksi tms.) Taulukkotaitto oli pitkään ainoa tapa muokata html-sivun layoutia, ja nykyisinkin selaimet tukevat vaihtelevasti CSS-taiton ominaisuuksia.
Jukka K. Korpelan suositus:
Taulukkotaiton ja CSS-asemoinnin välillä kannattaa tehdä tietoisia ja harkittuja ratkaisuja. Sekamuodot voivat johtaa isoihin ongelmiin. Taulukkotaitto ei kuitenkaan estä käyttämästä CSS:ää muuhun muotoiluun, kuten sarakkaiden leveyden määrittämiseen, reunaviivojen ulkoasuun jne.