De CSS-eigenschap padding-bottom stelt de hoogte in van de vulling aan de onderkant van een element. Voor padding is het, in tegenstelling tot margins, niet toegestaan om negatieve waarden te gebruiken. De verkorte notatie voor padding kan worden gebruikt om binnen één declaratie de vulling aan alle vier de kanten in te stellen.
/* <length> values */ padding-bottom: 0.5em; padding-bottom: 0; padding-bottom: 2cm; /* <percentage> value */ padding-bottom: 10%; /* Global values */ padding-bottom: inherit; padding-bottom: initial; padding-bottom: unset;
De paddingruimte is de ruimte tussen de inhoud en de rand van een element.
| Initial value | 0 |
|---|---|
| Applies to | all elements, except table-row-group, table-header-group, table-footer-group, table-row, table-column-group and table-column. It also applies to ::first-letter and ::first-line. |
| Inherited | no |
| Percentages | refer to the width of the containing block |
| Computed value | the percentage as specified or the absolute length |
| Animation type | a length |
Syntaxis
Waarden
length- De grootte van de padding als vaste waarde. Mag niet negatief zijn.
percentage- De grootte van de padding als een percentage, relatief aan de breedte van het element waarin het betreffende element staat. Mag niet negatief zijn.
Formele syntaxis
<length> | <percentage>
Voorbeelden
.content { padding-bottom: 5%; }
.sidebox { padding-bottom: 10px; }
Specificaties
| Specificatie | Status | Opmerking |
|---|---|---|
| CSS Basic Box Model The definition of 'padding-bottom' in that specification. |
Working Draft | Geen verandering ten opzichte van CSS Level 2 (Revision 1) The definition of 'padding-bottom' in that specification.. |
| CSS Transitions The definition of 'padding-bottom' in that specification. |
Working Draft | Definieert padding-bottom als animeerbaar. |
| CSS Level 2 (Revision 1) The definition of 'padding-bottom' in that specification. |
Recommendation | Geen verandering ten opzichte van CSS Level 1 The definition of 'padding-bottom' in that specification.. |
| CSS Level 1 The definition of 'padding-bottom' in that specification. |
Recommendation | Aanvankelijke definitie. |
Browsercompatibiliteit
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
padding-bottom | Chrome Volledige ondersteuning 1 | Edge Volledige ondersteuning 12 | Firefox Volledige ondersteuning 1 | IE Volledige ondersteuning 4 | Opera Volledige ondersteuning 3.5 | Safari Volledige ondersteuning 1 | WebView Android Volledige ondersteuning ≤37 | Chrome Android Volledige ondersteuning 18 | Firefox Android Volledige ondersteuning 4 | Opera Android Volledige ondersteuning 14 | Safari iOS Volledige ondersteuning 1 | Samsung Internet Android Volledige ondersteuning 1.0 |
Legenda
- Volledige ondersteuning
- Volledige ondersteuning
Zie ook
- CSS Boxmodel
- De verkorte notatie voor
paddingkan worden gebruikt om binnen één declaratie de vulling aan alle vier de kanten in te stellen:padding-top,padding-right,padding-bottomenpadding-left.