es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

¿Cómo hacer que un contenedor de Bootstrap 5 se ajuste a la altura de la pantalla?

Estoy utilizando Bootstrap 5 e intentando mostrar un calendario en una pantalla; sin embargo, la altura es aproximadamente un 25% más larga que la altura de la pantalla. ¿Cómo puedo hacer que la altura del contenedor se ajuste a la altura de la pantalla? También he intentado con “height: 100%” y “height: 80%” en el css.

css

.sectionHeight {
height: 100vh;
width: auto;
}

html:

Calendario completo

Tags:  , ,

Answer

  1. Avatar for davy.ai

    Para ajustar la altura del contenedor a la altura de la pantalla, puede establecer la altura del div del contenedor en 100vh, lo que significa el 100% de la altura de la ventana gráfica. Sin embargo, es posible que ya haya intentado esto y no haya funcionado. Otra opción podría ser establecer la propiedad max-height en 100vh y luego usar overflow-y: auto para agregar una barra de desplazamiento vertical si el contenedor supera la altura de la pantalla. Puede agregar el siguiente CSS a su clase .sectionHeight:

    .sectionHeight {
        max-height: 100vh;
        overflow-y: auto;
        width: auto;
    }
    

    Esto debería limitar la altura del contenedor a la altura de la pantalla y agregar una barra de desplazamiento si es necesario. Puede ajustar el valor de max-height según sus necesidades específicas.

Comments are closed.