Ιδιότητα bottom

Η ιδιότητα bottom ορίζει τη θέση του κάτω άκρου ενός στοιχείου. Οι τιμές για την ιδιότητα μπορούν να οριστούν με τις γενικά αποδεκτές μονάδες μέτρησης, για παράδειγμα, σε pixels, inches, points, ποσοστά. Οι τιμές που ορίζονται μπορούν να είναι και αρνητικοί αριθμοί, σε αυτήν την περίπτωση τα στοιχεία θα επικαλύπτονται το ένα πάνω στο άλλο. Η μέτρηση των συντεταγμένων καθορίζεται από την ιδιότητα position, η οποία συνήθως παίρνει την τιμή relative (σχετική θέση) ή absolute (απόλυτη θέση).

Σύνταξη

επιλογέας {
	bottom: αριθμός με μονάδα μέτρησης ή auto;
}

Παράδειγμα

Ας ορίσουμε κατά την επάνδρωση του θυγατρικού στοιχείου τη θέση του κάτω άκρου ίση με 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;
}
p:hover {
	bottom: 25px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
}

Παράδειγμα

Και τώρα ας είναι κατά την επάνδρωση το κάτω άκρο του θυγατρικού στοιχείου τοποθετημένο στα -50px:

<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;
}
p:hover {
	bottom: -50px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
}

Δείτε επίσης

η ιδιότητα top,
που ορίζει τη θέση του πάνω άκρου του στοιχείου
η ιδιότητα left,
που ορίζει τη θέση του αριστερού άκρου του στοιχείου
η ιδιότητα right,
που ορίζει τη θέση του δεξιού άκρου του στοιχείου
ο ψευδο-στοιχείο ::backdrop,
που ορίζει τη θέση μετά το πρώτο στοιχείο
η ιδιότητα caption-side,
που ορίζει τη θέση της επικεφαλίδας του πίνακα