Archivo Normalize
Se trata de un archivo descargable de GitHub para mejorar los estilos por defecto del navegador; se descarga desde Normalize.css-GitHub. También se puede descargar directamente desde la descarga directa (seleccionar Guardar Como).
-
En este caso, en el curso de CSS de "SoyDalto", él recomendó: ir a la línea 148 o 152 aproximadamente del archivo, dentro del estilo de "img" añadir la propiedad "max-width: 100%;" con el propósito de que las imágenes en los dispositivos móviles se ajusten a la pantalla y nunca la excedan.
-
También recomendó ir al inicio del documento y en un estilo global (*) poner "box-sizing: border-box;" así como un padding: 0; y un margin: 0; con el fin de que los elementos a los que se les añada un padding u otras propiedades de dimensiones no alteren las medidas establecidas por el desarrollador.
Esto se debe a que, por defecto, en un navegador al declarar un elemento con dimensiones de, por ejemplo, 50x50 y añadirle un padding de 20 en la zona superior e inferior, el navegador añadiría este padding a las dimensiones establecidas, resultando en un elemento que en realidad ocuparía 90x50.
Por lo tanto, lo que hace este cambio es impedir que las dimensiones establecidas por el desarrollador sean modificadas por otras propiedades. Continuando con este ejemplo, al añadir el padding, el elemento ya no sería de 90x50, sino que el padding se añadiría en el interior del elemento y no hacia el exterior, manteniendo así las dimensiones establecidas de 50x50.
Nota: al momento de poner el margin y el padding con un valor de 0 no se especifica ninguna unidad, ya que no es necesario; todo número multiplicado por cero es cero, por lo tanto no hace falta indicarla.
Como se mencionó al principio del apartado, el objetivo de incluir este documento en nuestros proyectos es mejorar la forma en la que el navegador implementa los estilos por defecto y, de esa forma, evitar que surjan errores al desarrollar el proyecto.