Padding

Con estas propiedades especificamos los márgenes de cualquier elemento y con el padding controlamos la distancia entre el borde y el contenido. Las propiedades que podemos utilizar son las siguientes:

 margin-top|margin-bottom|margin-left|margin-right Fijamos el margen superior, inferior, izquierdo o derecho. Con la propiedad auto el navegador un valor adecuado dependiendo del tipo de elemento.
XX unidades  %   auto  (el valor por defecto es 0)

Ejemplo: body {margin-top:1cm}

 margin    Mediante esta propiedad podemos especificar todos los valores de los márgenes de una sola vez. Se pueden poner hasta cuatro valores, para especificar cada uno de los márgenes. margin: ancho1 ancho2 ancho3 ancho4 Pero si sólo especificamosancho1 se refiere a los cuatro lados del margen.
Si se especifican dos valores, ancho1 se refiere a los lados superior e inferior y ancho2 al izquierdo y derecho. En el caso de poner los tres primeros, ancho1 se refiere al lado superior, ancho2 al izquierdo y derecho y ancho3 al inferior.

Ejemplo: body {margin: 1in 2in}

 padding-top|padding-bottom|padding-left
padding-right   Distancia entre el borde superior, inferior, izquierdo o derecho y el contenido.
XX unidades  %

Ejemplo: table {padding-top: 5.0pt}

 padding    Mediante esta propiedad podemos definir en una única propiedad los cuatro valores anteriores. Funciona de la misma manera que la propiedad margin.
margin: ancho1 ancho2 ancho3 ancho4

Ejemplo: h1 {padding:2%}