Vetia top

Vetia top përcakton pozicionin e skajit të sipërm të elementit nga pjesa e sipërme e elementit prind. Vlerat për vetinë mund të shkruhen me njësitë e pranuara të madhësive, për shembull, në piksel, inç, pika, përqindje. Vlerat e caktuara mund të jenë edhe numra negativë, në këtë rast elementët do të vendosen njëri mbi tjetrin. Numërimi i koordinatave përcaktohet nga vetia position, e cila zakonisht merr vlerën relative (pozicion relativ) ose absolute (pozicion absolut).

Sintaksa

përzgjedhësi {
	top: madhësi ose auto;
}

Shembull

Le të vendosim, kur kalojmë mbi elementin fëmijë, pozicionin e skajit të sipërm të tij të barabartë me 25px:

<div id="elem">
	<p></p>
</div>

#elem {
	width: 400px;
	height: 300px;
	border: 1px solid black;
}
p {
	position: relative;
	width: 100px;
	height: 100px;
	border: 1px solid red;
	margin-top: 50px;
	margin-left: 50px;
}
p:hover {
	top: 25px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
}

Shembull

Dhe tani le të jetë, kur kalojmë mbi të, skaji i sipërm i elementit fëmijë i vendosur në -50px:

<div id="elem">
	<p></p>
</div>

#elem {
	width: 400px;
	height: 300px;
	border: 1px solid black;
}
p {
	position: relative;
	margin-top: 50px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
	margin-left: 50px;
}
p:hover {
	top: -50px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
}

Shihni gjithashtu

vetia bottom,
e cila përcakton pozicionin e skajit të poshtëm të elementit
vetia left,
e cila përcakton pozicionin e skajit të majtë të elementit
vetia right,
e cila përcakton pozicionin e skajit të djathtë të elementit
pseudoelementi ::backdrop,
i cili përcakton vendosjen pas elementit të parë
vetia caption-side,
e cila përcakton pozicionin e titullit të tabelës