Problema con capas IE vs. Firefox con min-height/height

orange

No te lo tomes a mal, pero yo te recomendaría que te compraras un buen libro de CSS o que te leyeras un buen tutorial con los conceptos básicos.

Cuando el contenido de un DIV es mayor que su contenedor (y esto puede pasar, resumiendo un poco pero bueno, si le has definido width o height a ese DIV) se produce lo que se denomina desbordamiento, overflow en ingles.

Puedes definir 3 tipos de comportamiento del DIV cuando se produce overflow (de los cuales Explorer 6 sólo pilla 2).

Visible: El contenido del DIV desborda y se ve (se sale del DIV, para que nos entendamos). Este es el comportamiento por defecto según la especificación CSS y es el que Explorer 6 no pilla, porque tiene un bug y, en lugar de dejar el DIV quietecito y desbordar el contenido, lo que hace es agrandar el DIV

Auto: Si el contenido es menor que el DIV se muestra un DIV normal, si es mayor aparece un scroll que hace que puedas mover el contenido y verlo todo.

Hidden: El contenido que desborda se oculta.

En CSS3 puede diferenciar overflow-x (para los desbordamientos horizontales) y overflow-y (para los verticales). Aunque CSS3 todavía no es una especificación terminada, esas 2 propiedades ya las soportan todos los navegadores principales.

Uisss lo que me ha dicho... pues claro que no me lo tomo a mal, muchas gracias por la info.

La verdad es que los conceptos que tengo de CSS son los que he ido aprendiendo sobre la marcha, se que tendría que haberme echo una base mas solida con unos fundamentos (como dice nuestro amigo arguiñano) pero mira, las prisas, el trabajo, la necesidad. Pero creo que ya toca ponerse con el librito.

Muchas gracias orange y disculpa las molestias.

No te lo tomes a mal, pero yo te recomendaría que te compraras un buen libro de CSS o que te leyeras un buen tutorial con los conceptos básicos.

Cuando el contenido de un DIV es mayor que su contenedor (y esto puede pasar, resumiendo un poco pero bueno, si le has definido width o height a ese DIV) se produce lo que se denomina desbordamiento, overflow en ingles.

Puedes definir 3 tipos de comportamiento del DIV cuando se produce overflow (de los cuales Explorer 6 sólo pilla 2).

Visible: El contenido del DIV desborda y se ve (se sale del DIV, para que nos entendamos). Este es el comportamiento por defecto según la especificación CSS y es el que Explorer 6 no pilla, porque tiene un bug y, en lugar de dejar el DIV quietecito y desbordar el contenido, lo que hace es agrandar el DIV

Auto: Si el contenido es menor que el DIV se muestra un DIV normal, si es mayor aparece un scroll que hace que puedas mover el contenido y verlo todo.

Hidden: El contenido que desborda se oculta.

En CSS3 puede diferenciar overflow-x (para los desbordamientos horizontales) y overflow-y (para los verticales). Aunque CSS3 todavía no es una especificación terminada, esas 2 propiedades ya las soportan todos los navegadores principales.

Aja, pero una cosa que me sucedio el otro dia, es que tenia una página toda cuca ella y en una capa como la fuchsia tenia el overflow:auto; y sin motivo aparente, cuando el contenido de la página hacia scroll vertical, también hacia scroll horizontal... le quite el overflow:auto; y desparareció el scroll horizontal y todo quedó en su sitio...

Quizas era culpa de alguna otra cosa que hacia x ahí....

esto del min-height y el hack, mas que nada usaba 100% por que claro, no esta definida la altura de esa capa, por que al ser texto procedente de base de datos...... entonces ese min-height: 300px; (por poner una medida) ... se lo pasará por el forro, por que la capa seguramente será mas larga...

Es que lo del display.inline es un error gordo y no habrá manera de que te funcione así...

Mira, echándole un ojo al código creo que hay bastantes cosas que no están muy claras (caso de los 100% y similares). Trato de darte alguna receta muy sencillita...

Para temas de min-height, una solución facil:

min-height: 300px; /* Estandares y Explorer 7 */
_height: 300px; /* Explorer 6 */

Para temas de cleraing de contenedores con elementos flotados:

Al contenedor padre has de ponerle:

overflow: auto; /* Estandares y Explorer 7 */

Eso te funcionará además en Explorer 6, si ya le tienes definido un width, un height o un position distinto a static, si no has de meterle esto:

zoom: 1; /* Explorer 6 */

La mayoría de estas ñapas no validan CSS, pero son las más sencillas de aplicar. Teniendo en cuenta el código que enseñas no creo que sea un problema en tu caso.

De todas maneras, y si todo este pollo es para tener una web que ocupe de alto el 100% de la pantalla, vas a tener que hacer más cosas.

orange

min-height funciona en FireFox y Explorer 7, para el 6 tiene que meter algún hack.

Pero el problema seguramente venga de otro sitio ¿tienes flotados ambos elementos, dentro de la caja fucsia??

le he quitado los mayor que y los menor que y ahora se pueden ver los estilos orange.

Y si, las tengo flotadas, es que si uso el display:inline, luego no me deja variar el width de las capas.. no lo entiendo... a la que le meto display:inline a esas 2 capas, suda del width que le he puesto.... :(

perdón wences...se me ha ido la castaña, lo siento, arreglado.

markshock:
https://www.domestika.org/foros/viewtopic.php?t=25506

Imágenes
Las imágenes que se incluyan dentro del foro, no podrán superar los 450 px de ancho. Y se recomienda que estén optimizadas al máximo posible para facilitar la descarga de la página.

min-height funciona en FireFox y Explorer 7, para el 6 tiene que meter algún hack.

Pero el problema seguramente venga de otro sitio ¿tienes flotados ambos elementos, dentro de la caja fucsia??