Gestire il "padding (spazi interni)"
Interno ad un DIV-Box

Questo box ha il padding sinistro impostato con un valore in pixel.

.box-1 {
width: 400px;
height: 200px;
padding-left: 40px;
border: 1px solid #002c53;
background: #568ec0;
}

Proprietà singola espressa in percentuale

Questo box ha il padding superiore impostato con un valore in percentuale.

.box-2 {
width: 400px;
height: 200px;
padding-top: 10%;
border: 1px solid #002c53;
background: #568ec0;
}

Su questo box abbiamo usato la proprietà abbreviata padding con 4 valori.

.box-3 {
width: 400px;
height: 200px;
padding: 10px 20px 15px 30px;
border: 1px solid #002c53;
background: #568ec0;
}

Su questo box abbiamo usato la proprietà abbreviata padding con 2 valori.

.box-4 {
width: 400px;
height: 200px;
padding: 20px 15px;
border: 1px solid #002c53;
background: #568ec0;
}

Su questo box abbiamo usato la proprietà abbreviata padding con un solo valore.

.box-5 {
width: 400px;
height: 200px;
padding: 30px;
border: 1px solid #002c53;
background: #568ec0;
}

<-->