Les marges intérieures (padding)

jdb-padding

Les classes de marges intérieures permettent d'ajouter une ou plusieurs marges intérieures à n'importe quel élément.

Certaines classes ont un ou plusieurs synonymes plus raccourcis, particulièrement pour les noms de tailles :

medium → md
large → lg
xlarge → xl
xxlarge → xxl

jdb-padding-lg

J'ai 12px de marge en haut et en bas, et 24px de marge à gauche et à droite.

Code :

<div class="jdb-panel jdb-padding-lg jdb-dark-gray">
  <h4>jdb-padding-lg</h4>
  <p>J'ai 12px de marge en haut et en bas, et 24px de marge à gauche et à droite.</p>
</div>

Exemples des marges nommées :

jdb-padding-top

J'ai 16px de marge en haut.

jdb-padding-right

J'ai 16px de marge à droite.

jdb-padding-bottom

J'ai 16px de marge en bas.

jdb-padding-left

J'ai 16px de marge à gauche.

jdb-padding-tiny

J'ai 2px de marge en haut et en bas, et 4px de marge à gauche et à droite.

jdb-padding-small, jdb-padding-sm

J'ai 4px de marge en haut et en bas, et 8px de marge à gauche et à droite.

jdb-padding

J'ai 8px de marge en haut et en bas, et 16px de marge à gauche et à droite.

jdb-padding-large, jdb-padding-lg

J'ai 12px de marge en haut et en bas, et 24px de marge à gauche et à droite.

Exemples des marges numérotées :

jdb-padding-0, jdb-padding-none

Je n'ai aucune marge intérieure.

jdb-padding-4

J'ai 4px de marge en haut et en bas.

jdb-padding-8

J'ai 8px de marge en haut et en bas.

jdb-padding-12

J'ai 12px de marge en haut et en bas.

jdb-padding-16

J'ai 16px de marge en haut et en bas.

jdb-padding-24

J'ai 24px de marge en haut et en bas.

jdb-padding-32

J'ai 32px de marge en haut et en bas.

jdb-padding-48

J'ai 48px de marge en haut et en bas.

jdb-padding-64

J'ai 64px de marge en haut et en bas.

jdb-padding-128

J'ai 128px de marge en haut et en bas.