Reflektert dagbok – multimediedesign

CSS position

Denne gangen skulle vi bruke CSS-dokumentet fra forrige øvelse og plassere de tre <p>-taggene fra en vertikal til en horisontal plassering. Vi skulle sette bredde på div-taggen og på p-taggene, og øve på position absolute, position relative og float right.

Det kom masse ekstra kode når jeg skulle sette på border sist, og jeg prøvde å gjøre det omigjen og fikk det plutselig til denne gangen, med riktig kode. Her er koden:

Og slik ble det riktig:

Endret teksten og satte div-tagger på hvert avsnitt, samt satte bredden på hver av dem til 200px:

Satte inn bakgrunnsfarge, men selv om hver setning/hvert avsnitt nå hadde fått egne div-tagger (#paragraf-a, #paragraf-b, #paragraf-c) så var jo p-taggene fortsatt kodet med grå bakgrunn.

Fjernet den grå bakgrunnsfargen på p-taggene:

Testet ut ABSOLUTE POSISTION, denne er med 215 px til venstre og 10px fra toppen:

ABSOLUTE POSISTION, med 215 px til venstre og 68px fra toppen:

RELATIVE POSISTION, med 215 px til venstre og 5px fra toppen:

RELATIVE POSISTION, med 215 px til venstre og 20px fra toppen:

RELATIVE POSISTION, med 215 px til venstre og 68px fra toppen:

ABSOLUTE POSISTION, med 215 px til venstre og MINUS 65px fra toppen:

Der stod den gule og den blå endelig likt på linje på toppen.

Legg igjen en kommentar

Fyll inn i feltene under, eller klikk på et ikon for å logge inn:

WordPress.com-logo

Du kommenterer med bruk av din WordPress.com konto. Logg ut / Endre )

Twitter picture

Du kommenterer med bruk av din Twitter konto. Logg ut / Endre )

Facebookbilde

Du kommenterer med bruk av din Facebook konto. Logg ut / Endre )

Google+ photo

Du kommenterer med bruk av din Google+ konto. Logg ut / Endre )

Kobler til %s