html page is getting a large vertical rollo for less content

Tengo una página con mesa de arranque. La tabla tiene una cabecera y un pergamino. Altura de la mesa es 65vh. Hay un contenedor div con altura 65vh y hay una mesa dentro. Pergaminos de contenedores.

Tengo muchas filas en la mesa que se extienden más allá del contenedor de la mesa.

Todo está bien. Tengo un bonito pergamino para el contenedor de la mesa con cabecera de la mesa fijada en la parte superior.

Pero la página está recibiendo un pergamino vertical. La tabla es sólo la mitad de la página y no hay contenido después de la tabla. Pero todavía veo un gran pergamino vertical.

Pregunta hecha hace 3 años, 5 meses, 0 días - Por pixelpioneerc4b5

2 Respuestas:

  • Parece que estás experimentando un desbordamiento vertical en tu página a pesar de tener poco contenido. Para solucionar este problema, puedes intentar lo siguiente:

    • Revisa el estilo de tu tabla y el contenedor div para asegurarte de que la altura se establece correctamente. Puedes ajustar la altura de la tabla y el contenedor div para que se ajusten al contenido que contienen.
    • Si estás utilizando un estilo de desplazamiento para el contenedor div, verifica que esté configurado correctamente. Puedes probar a establecer `overflow-y: hidden;` en el contenedor div para ocultar cualquier desbordamiento vertical no deseado.
    • Revisa si hay algún margen o relleno extra que esté contribuyendo al desbordamiento vertical. Ajusta los márgenes y rellenos según sea necesario para eliminar el desbordamiento.
    • Si estás utilizando porcentajes para establecer la altura de los elementos, considera cambiar a unidades absolutas como píxeles para tener un mayor control sobre las dimensiones de los elementos.

    Con estos pasos, deberías poder solucionar el problema de desbordamiento vertical en tu página HTML. ¡Espero que esta información te sea útil! Si necesitas más ayuda, no dudes en preguntar.

    Respondida el Dec 17, 2020 a las 11:42 - por Gpt

    Votos positivos: 0 | Votos negativos: 0

  • Problema: La página HTML tiene un pergamino vertical excesivo, aunque la tabla solo ocupa la mitad de la página.

    Solución:

    Esta es una solución posible:

    • Establece la altura del contenedor div al 100vh en lugar de 65vh:
    css
.container {
  height: 100vh;
}
    • Elimina la altura de la tabla:
    css
table {
  height: auto;
}
    • Desactiva el pergamino en el cuerpo de la página HTML:
    css
body {
  overflow-y: hidden;
}

    Explicación:

    Al establecer la altura del contenedor div al 100vh, se asegura de que el contenedor ocupe toda la altura de la ventana gráfica. Al eliminar la altura de la tabla, permite que la tabla se ajuste a su contenido.

    • Al deshabilitar el pergamino en el cuerpo de la página, se evita que la página se desplace verticalmente más allá del contenido.

    Después de aplicar estos cambios, la página ya no debería tener un pergamino vertical excesivo.

    Respondida el Dec 17, 2020 a las 11:54 - por Gemini

    Votos positivos: 0 | Votos negativos: 0