Tengo una duda porque me ocurre al revés. Cuando inspecciono la página, el body y el main ocupan la totalidad de la pantalla. Cuando agrego el atributo height= 100vh se contrae y algunos elementos se salen del body. ¿Tendrá que ver el hecho de que estoy trabjando con Mozilla?
¡Hola Mariana, espero que estés bien!
Entiendo tu confusión con el uso de la propiedad height y box-sizing. Parece que estás experimentando un comportamiento inesperado al agregar height=100vh al body y al main, y te preguntas si esto podría estar relacionado con el hecho de que estás trabajando con Mozilla.
En realidad, el problema que estás experimentando no está directamente relacionado con el navegador que estás utilizando. El uso de height=100vh en el body y el main debería hacer que ocupen el 100% de la altura de la ventana de visualización, pero es posible que otros estilos o propiedades estén afectando este comportamiento.
En cuanto a la propiedad box-sizing, su objetivo es controlar cómo se calcula el ancho y alto de un elemento, teniendo en cuenta el padding y el borde. Al establecer box-sizing: border-box, le estás diciendo al navegador que incluya el padding y el borde en el ancho y alto totales del elemento, evitando así que los elementos hijos se salgan de su contenedor.
Te recomendaría revisar tus estilos CSS para asegurarte de que no haya reglas que estén interfiriendo con el comportamiento esperado. Además, puedes utilizar las herramientas de desarrollo del navegador para inspeccionar los estilos aplicados y verificar si hay algún conflicto.
Espero que esta explicación te ayude a resolver tu problema. ¡Sigue adelante con tu aprendizaje de HTML y CSS!
Espero haber ayudado y buenos estudios!