Il padding nel CSS

Padding, Cos'è?

La proprietà padding (imbottitura) è una proprietà che si utilizza per definire lo spazio che ci deve essere tra il contenuto e il bordo del contenitore.

Il padding può essere specificato per ogni singolo lato attraverso le proprietà:

- padding-top;
- padding-right;
- padding-bottom;
- padding-left.

Esempi:








Se vogliamo possiamo specificare il nostro padding con una proprietà più corta:

padding:5px 10px 15px 60px;
top padding è 5px
right padding è 10px
bottom padding è 15px
left padding è 60px

padding:25px 50px 75px;
top padding è 25px
right e left paddings sono 50px
bottom padding è 75px

padding:25px 50px;
top e bottom paddings sono 25px
right e left paddings sono 50px

padding:25px;
Tutti e quattro i paddings sono 25px

Esempi Presi da w3schools

Il padding per noi skinner è una proprietà molto importante, ci permette di sistemare il testo dentro un immagine, nella posizione che desideriamo. un esempio pratico? quando andiamo a creare un menù personalizzato con l'immagine di sfondo, spesso il testo può uscire o essere troppo a destra rispetto alla nostra immagine, in questo caso, ci aiutiamo con il padding.