Svojstva pozicioniranja (Positioning properties)

Dodatak 11


Svojstva Vrijednosti Objašnjenje Primjer (KOD) Primjer (Izgled)
bottom auto
visina (npr. 16px)
procenat (npr. 80%) 		Definiše udaljenost elementa od dna roditeljskog (parent) elementa.

p {
position: relative;
bottom: 20px;
}

Tekst
clip

oblik (npr. rect)
auto

Definiše oblik elementa. img.clip {
position: absolute;
clip: rect(10px 200px 50px 0px);
}
left auto
dužina (npr. 16px)
procenat (npr. 80%) 		Definiše udaljenost elementa od lijevog kraja roditeljskog (parent) elementa. p {
position: relative;
left: 20px;
}

Tekst
overflow visible
hidden
scroll
auto		 Definiše izgled elementa u slučaju da njegov sadržaj prelazi negovu veličinu. #div01 {
overflow: scroll;
}

Neki Text...

Neki Text...

Neki Text...

Neki Text...

Neki Text...

Neki Text...
position static
relative
absolute
fixed		 Postavlja element u statičnu, relativnu, apsolutnu ili fiksiranu poziciju. #fix {
position: fixed;
}
Fiksiran text
right auto
dužina (npr. 16px)
procenat (npr. 80%) 		Definiše udaljenost elementa od desnog kraja roditeljskog (parent) elementa. p {
position: relative;
right: 20px;
}

Tekst
top auto
dužina (npr. 16px)
procenat (npr. 80%) 		Definiše udaljenost elementa od vrha roditeljskog (parent) elementa. p {
position: relative;
top: 20px;
}

Tekst
vertical-align

baseline
sub
super
top
text-top
middle
bottom
text-bottom
visina (npr. 16px)
procenat (npr. 80%)

Definiše vertikalno poravnanje unutar elementa. #polje {
vertical-align: bottom;
}		 Tekst
z-index auto
broj (npr. -1)		 Definiše raspored gomile u elementu. #z-in {
position: absolute;
z-index: -1;
}
Tekst preko slike

*Vrijednosti ispisane kurzivom se odnose na vrijdnosti koje su definisane svojstvom istog imena (npr. u svojstvu font vrijednost font-weight je zapravo grupa vrijednosti definisanih svojstvom font-weight (npr. bolder)).