¿Por qué termina mi página cuando se hace realmente larga?

Su problema es que quien creó este tema está usando una imagen png 952 × 3575 como fondo para esa columna izquierda. Entonces, después de que esa sección tenga más de 3575 píxeles de altura, literalmente no queda más imagen de fondo para que el navegador muestre. También notará que la imagen de fondo está configurada para que no se repita, lo que significa que no se colocará en mosaico en la dirección horizontal o vertical. Aquí está ese CSS:


Ahora, la solución obvia aquí sería cambiar esa regla de fondo a algo como:

background: url(images/content-bg.png) top left repeat-y;

Sin embargo, como puede ver a continuación, la imagen de fondo en realidad incluye esquinas redondeadas y sombra paralela en la parte superior, por lo que obtendrá algo como esto, con ese espacio incómodo donde la imagen intenta en mosaico vertical:

Para su información, incluido aa 952 × 3575 png como imagen de fondo es una idea terrible. Es una gran pérdida de ancho de banda y le da una restricción arbitraria de altura.

La razón por la que quien creó el tema es incluso usar una imagen para hacer esto en primer lugar probablemente porque quieren que la sombra paralela y las esquinas redondeadas se muestren en navegadores antiguos (IE) donde css3 border-radius y box-shadow no son disponible. Es un buen objetivo, pero usar una imagen PNG grande no es la mejor manera de hacerlo. Una mejor manera sería tener 3 divs de la siguiente manera:

  • Un encabezado div, que contiene una imagen de ancho completo y quizás 30 o 40 píxeles de alto. Esta imagen es la parte superior del “contenedor” y tendría las esquinas redondeadas y las sombras paralelas.
  • Un div de contenido cuya altura se expandiría automáticamente y cuya imagen de fondo sería una imagen de ancho completo y 1 píxel de altura, en mosaico vertical.
  • Un div de pie de página que es exactamente igual al div de encabezado, pero con la imagen de fondo invertida verticalmente.

Dado que las imágenes aún tienen sombras paralelas después de que desaparece el fondo, su CSS aún funciona.

Su contenedor simplemente no es lo suficientemente largo. Esto podría deberse a un problema de flotación o si codificó un valor en su CSS.

Intente configurar la altura del elemento en auto. Si eso no funciona, intente poner esto:

  

En el fondo de tu contenedor.

Luego pon esto en tu hoja de estilo.

  .claro{
 altura: 0;
 ancho: 0;
 Visibilidad: ninguna;
 Limpia los dos;
 }

Esto debería solucionar tus problemas. Si no, comente y trataré de solucionarlo.

Si su cuadro de contenido contiene elementos flotantes, probablemente necesite poner

 

justo antes de cerrar el elemento (¿probablemente div?) Que controla el fondo que se supone que se estira …

A la gente no le gusta leer grandes cantidades de contenido mientras examina la web, y su navegador simplemente cumple con las especificaciones del W3C: intentará automáticamente truncar el contenido que va más allá del Umbral de concentración recomendado por el grupo Nielsen-Norman ™. Sin embargo, WAI-ARIA acaba de alcanzar el estado de recomendación del W3C en los últimos días, por lo que si tiene un navegador actualizado, configurar ‘aria-role = aburrido’ en el elemento contenedor principal hará que su contenido se ajuste. ¡Espero que ayude!

Veo varios problemas. Primero, las imágenes en su página no parecen ‘fluir’ con el tamaño de sus contenedores. En segundo lugar, el contenedor más grande, que contiene las imágenes, tiene un problema relacionado.

Pruebe esto con el contenedor de página más grande:

#envase {
altura: auto;
ancho: 100%;
}
y creo que tu problema se resolverá.

Eso podría ser causado por varias cosas. Supongo que el contenedor blanco tiene una altura y un desbordamiento establecidos visibles. En ese caso, cuando el contenido exceda la altura designada, se ‘derramará’ y se verá exactamente como su captura de pantalla. Eliminar / modificar una o ambas propiedades debería solucionarlo.

More Interesting

Actualmente estoy aprendiendo HTML, CSS y JavaScript. ¿Se volverán obsoletos estos idiomas debido a sitios web como WordPress y Wix?

Mi jefe está tratando de convertirme en gerente de proyecto de un desarrollador web debido a mi buen historial de comunicación con los clientes. ¿Cuáles podrían ser las consecuencias positivas o negativas?

¿Qué lenguaje de desarrollo web debo aprender en 2017?

Sé HTML, CSS, PHP y MYSQL individualmente. Pero el problema es cómo usar estos cuatro juntos. Html y css se pueden usar juntos. Pero, ¿cómo usar php y mysql junto con ellos? No entiendo la implementación.

Cómo comenzar a crear un sitio web

Tengo conocimientos de HTML. ¿Es necesario que conozca C ++ y Java antes de aprender sobre Python o es HTML suficiente?

Necesito crear una página web propia. ¿Cuál es la mejor manera de hacerlo?

Cómo seleccionar todos los valores desplegables usando Selenium WebDriver

Soy un gerente de producto experimentado con un mínimo conocimiento de codificación. Me gustaría ser lo suficientemente bueno en el desarrollo web para comenzar a crear prototipos funcionales de mis ideas de inicio. ¿Cuál debería ser mi enfoque?

Soy un desarrollador de Ruby autodidacta, ¿debo ir a la escuela?

Estoy diseñando un menú de navegación. ¿Algún consejo o truco que lo haga increíble? ¡Gracias!

Me estoy preparando para externalizar el desarrollo de mi sitio web. Es un sitio de intercambio de conocimientos con características sociales. Quiero escribir los requisitos para ello. ¿Hay algún sitio donde pueda obtener requisitos de muestra o ayuda?

Estoy interesado en aprender Angular JS, ¿debería usar Angular 1.xy luego transferir a Angular 2.xo directamente a Angular 2?

¿Soy considerado un programador si soy desarrollador web?

Quiero construir mi primera aplicación web. ¿Tendré éxito si empiezo a codificar mi aplicación web (aprendiendo sobre la marcha) o si me tomo un mes para aprender primero los fundamentos de las redes informáticas?