El “padding” o relleno, junto con los márgenes es uno de los aspectos más importantes a la hora de estructurar una página Web. Podemos tener el mejor diseño Web posible, pero si el “padding” y los márgenes están fuera de sitio, no se verá bien.
Generalmente es un aspecto en donde se invierte mucho tiempo, para que todo encaje perfectamente dentro de la estructura, de ese modo se facilita la colocación de la información pertinente, por eso es necesario tener la separación y la gestión de los espacios en blanco muy estudiada.
En el artículo eminentemente práctico que se titula Using padding in your design de WeAreNotFreelancers, nos muestra de una manera muy gráfica la diferencia entre los márgenes y los paddings, y lo explica muy bien. A menudo, se confunde los dos y uno puede frustrarse cuando las cosas no se ven bien.
Para aclarar conceptos:
El margen es la distancia entre un elemento y sus elementos circundantes.
El “padding” es la distancia de los temas dentro de un elemento.
Ejemplo de mal uso del padding:
Ejemplo de buen uso del padding:






Noviembre 19th, 2008 a las 7:14 pm
Este artículo esta bueno, pero faltó acotar la necesidad de insertar el div dentro de otro que lo contenga, lo que en css generalmente se llama wrap o wrapper. Yo por ejemplo los margins se los asigno al wrap y al div interno le asigno los padding. Por qué de esto? pues porque si no creamos un wrap cuando le asignemos padding al div y si ya tenemos una altura y ancho establecidos estos se nos modificarán.
Noviembre 20th, 2008 a las 5:40 am
Muchas gracias por la aclaración. Salud Irwin.