Alguien sabe por que cuando tenemos pantallas de mayor resulucion el main a pesar de tener el alto del 100% no se adapta mientras que con...

Armando Chindoy

Armando Chindoy

Pregunta
studenthace 5 años

Alguien sabe por que cuando tenemos pantallas de mayor resulucion el main a pesar de tener el alto del 100% no se adapta mientras que con la propiedad vh si se adapta pero cuando esta en pantallas de menor tamaño es alrevez?

si algo pueden probarlo con las dev tools para revisar esto.

tamaño de pantalla grande

tamño menor

5 respuestas
para escribir tu comentario
    Franklin Peñafiel

    Franklin Peñafiel

    studenthace 3 años

    Al usar height:100% estás indicando que será solo el 100% del contenido y no de la pantalla, para hacer que sea de la pantalla debes usar min-height:100vh para indicar que el tamaño mínimo sería en base a la pantalla y si se pasa de eso se irá adaptando. Si quieres usar el height:100% debes de hacer otra configuración al div contenedor, pero mejor quédate con la solución de min-height, con la práctca entenderás cuál es la respuesta correcta dependiendo la situación

    Oyuki Collado Velasco

    Oyuki Collado Velasco

    studenthace 4 años

    Noté lo mismo y buscando posibles soluciones encontré que poniendo "min-height:100vh;" podria solucionarlo.

    Brayan Ramirez Alzate

    Brayan Ramirez Alzate

    studenthace 4 años

    tengo exactamente la misma dudad mi pantalla es 1080 y de 22 pulgadas

    Armando Chindoy

    Armando Chindoy

    studenthace 5 años

    nop eso es lo que decia en mi pregunta que no funciona ya que con vh no me funciona bien en pantallas pequeñas mientras que en pantallas grandes funciona a la perfecion por eso puse los dos ejemplos

    Bryan Omar Vera Cachay

    Bryan Omar Vera Cachay

    studenthace 5 años

    tienes que ponerle 100vh y se solucionara.

Curso de Preprocesadores CSS

Curso de Preprocesadores CSS

Los preprocesadores extienden las características de HTML y CSS promoviendo la escritura de código reutilizable y modular. Conoce la sintaxis, características e implementación de un preprocesador de HTML y CSS. Elabora plantillas modulares de páginas HTML con PUG. Utiliza los tres principales preprocesadores de CSS: Sass, Less y Stylus y decide cuál se ajusta mejor a tu flujo de trabajo.

Curso de Preprocesadores CSS

Curso de Preprocesadores CSS

Los preprocesadores extienden las características de HTML y CSS promoviendo la escritura de código reutilizable y modular. Conoce la sintaxis, características e implementación de un preprocesador de HTML y CSS. Elabora plantillas modulares de páginas HTML con PUG. Utiliza los tres principales preprocesadores de CSS: Sass, Less y Stylus y decide cuál se ajusta mejor a tu flujo de trabajo.