CSS Pozicija elemenata
Šta omogućava CSS Pozicija elmenata?
Web stranice su sastavljene od velikog broja elmenata koji su raspoređeni na raznim mjestima web stranice. Da bi to bilo moguće,
potrebno je odrediti njihovu poziciju. CSS pozicija omogućava pozicioniranje elemenata na web stranici, ali i metod koji će se
koristiti za pozicioniranje.
Za određivanje pozicije elemenata koristi se parametar position.
Parametar position ima pet različitih vrijednosti, a to su:
position: static;
position: relative;
position: absolute;
position: fixed;
position: sticky;
Nakon što se odabere vrijednost parametra, potrebno je odrediti gdje će se element nalaziti na stranici.
To se određuje pomoću parametra top = (gore), bottom = (dolje), left = (lijevo) i right = (desno).
Ovi parametri određuju udaljenost elementa od ivica web stranice.
notification_important
Da bi mogli koristiti parametre top, bottom, left, right, potrebno je prvo napisati position, u suprotnom ovi parametri neće raditi.
static
Svi HTML elementi po defoult-u imaju static poziciju, bez obzira da li uključili parametar ili ne.
Elementi koji imaju poziciju static nisu podložni parametrima top, bottom, left i right, što znači da će oni biti
pozicionirani po prirodnom toku u odnosu na ostale elemente.
Ovaj paragraph ima poziciju static.
p {
position: static ; <!-- Može se izostaviti -->
}
relative
Elementi koji imaju poziciju relative, su postavljeni tako da je njihova pozicija relativna u odnosu na njenu prirodnu poziciju.
Ovaj paragraph ima poziciju realtive i nalazi se 40px udaljen udesno od njegove originalne pozicije.
p {
position: relative;
left: 40px;
}