Definir tres clases distintas con formatos diferentes para expresar el padding. Aplicar las clases a tres párrafos.
<!DOCTYPE html> <html> <head> <title>Problema</title> <meta charset="UTF-8"> <link rel="StyleSheet" href="estilos.css" type="text/css"> </head> <body> <p class="ancho">Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. </p> <p class="mediano">Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. </p> <p class="corto">Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. Esto es una prueba para ver el funcionamiento de la propiedad padding. </p> </body> </html>
.ancho {
padding:2px;
background-color:#eeeeee;
}
.mediano {
padding:10px 12px;
background-color:#eeeeee;
}
.corto {
padding:5px 0px 20px 40px;
background-color:#eeeeee;
}