Índice

Espaciado interno

Esta propiedad permite definir el margen interior del elemento caja.

padding:

padding-top:

padding-right:

padding-bottom:

padding-left:

auto

o bien valor de longitud

o bien porcentaje

Comentarios

  • El valor auto deja al navegador la gestión para la visualización de los márgenes internos.

  • Un valor de longitud define con precisión los márgenes interiores.

  • Un porcentaje define la longitud respecto al elemento padre.

  • El margen interior a cada lado del elemento caja puede definirse de forma individual mediante las propiedades padding-top, padding-right, padding-bottom y padding-left. Las direcciones top, right, bottom, left indican, respectivamente, los bordes superior, derecho, inferior e izquierdo.

  • Es posible abreviar la escritura de las propiedades del margen interno padding-top, padding-right, padding-bottom y padding-left, informando uno, dos, tres o cuatro valores de la propiedad padding.

    Si se informa un único margen, se aplica a los cuatro lados.

    Con dos márgenes, el primero se aplica a los lados superior e inferior. El segundo se aplica a los laterales (márgenes derecho e izquierdo).

    Con tres valores, el primero se aplica al lado superior, el segundo a los márgenes laterales y el tercero al lado inferior.

    Con cuatro márgenes, éstos se aplican en el sentido de las agujas del reloj partiendo del lado superior, es decir superior, derecho, inferior e izquierdo.

Ejemplo

<!DOCTYPE html> 
<html lang="es"> 
<head> 
<title>Html5</title>  ...