padding (εσωτερικά περιθώρια)
Το padding ορίζει το διάκενο (ή το εσωτερικό περιθώριο) ανάμεσα στο περίγραμμα και το περιεχόμενο ενός στοιχείου html.
Στιλ για padding και οι αντίστοιχες τιμές
Ιδιότητα στιλ | Τιμή |
---|---|
padding-top | τιμή μήκους (π.χ. 2px) ή auto ή % (π.χ. 10%) |
padding-right | τιμή μήκους (π.χ. 2px) ή auto ή % (π.χ. 10%) |
padding-bottom | τιμή μήκους (π.χ. 2px) ή auto ή % (π.χ. 10%) |
padding-left | τιμή μήκους (π.χ. 2px) ή auto ή % (π.χ. 10%) |
padding | τιμή μήκους (π.χ. 2px) ή auto ή % (π.χ. 10%) |
Το στιλ padding μπορεί να πάρει από μία μέχρι τέσσερις τιμές. Οι τιμές διαβάζονται με τη σειρά: top, right, bottom, left. Όταν λείπει μια από τις τέσσερις τιμές, τότε αυτή που λείπει παίρνει την τιμή της απέναντι.
Δεν μπορείτε να ορίσετε αρνητικές τιμές.
Η τιμή auto σημαίνει οτι το διάκενο θα αλλάξει αναλογικά, όταν αλλάξει κάποιο άλλο διάκενο σε μια από τις τέσσερις πλευρές.
Όταν προσθέτετε εσωτερικά περιθώρια σε ένα στοιχείο, οι διαστάσεις του μεγαλώνουν. Δηλαδή το στοιχείο καλύπτει μεγαλύτερο χώρο και τα διπλανά στοιχεία μετακινούνται.
Για να αποφύγετε αλλαγή διαστάσεων μπορείτε να χρησιμοποιήσετε την ιδιότητα box-sizing
. Δείτε: Η ιδιότητα box-sizing
Το padding δεν κληρονομείται.