¿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
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 propiedadmax-height
en100vh
y luego usaroverflow-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
: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.