¿Puede un niño influir en el tamaño de su matriz en modo estándar?

StackOverflow https://stackoverflow.com/questions/1712280

  •  19-09-2019
  •  | 
  •  

Pregunta

Tome esta página, por ejemplo, es posible insertar un niño en mydiv tal que hará que la altura de mydiv a crecer más allá de 500px? 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<body>
    <div id="mydiv" style="width:500px;height:500px;border:4px solid red">
        <!-- place content here -->
    </div>
</body>
</html>

No puedo encontrar nada que lo hará. Por ejemplo, esta situación continuación he dicho innerDiv a ser de 100% en la altura. Será averiguar su matriz es 500 píxeles de alto, y por lo tanto también ser 500 píxeles de alto. El resultado neto es que el contenido es 800px de alto, y el contenido se derrama hacia fuera más allá de mydiv, con mydiv siendo un acérrimo 500 píxeles de altura: 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<body>
    <div id="mydiv" style="width:500px;height:500px;border:4px solid red">
        <img src="myimage.jpg" width="400" height="300" />
        <div style="width:100%;height:100%;background:yellow">
            hi
        </div>
    </div>
</body>
</html>

IE se ejecuta en modo peculiaridades causará mydiv a crecer para dar cabida a sus hijos en muchas situaciones. Parece normas modo explícitamente no va a crecer. Es que siempre el caso?

Estoy probando esto principalmente en IE8 y FF3.5 en Windows, con Internet Explorer 8 se ejecuta en todas sus posibles modos.

¿Fue útil?

Solución

No: en el modo de normas, la propiedad overflow por defecto de un recipiente se debe establecer en visible lo que significa que el contenido de desbordamiento se representará fuera del área de recorte del contenedor. No hay tal opción overflow que crezca el tamaño del contenedor para que coincida con sus hijos. Se puede ver más en desbordamiento aquí

Sin embargo, existen métodos de cultivo del recipiente para que coincida con el tamaño de sus hijos. En el modo estándar, la forma correcta de hacerlo es establecer el min-height propiedad CSS en lugar de la height propiedad.

Desde el Altura hacer cumplir comportamiento no ocurre en IE6, la gente por lo general terminan configurando tanto para min-height compatible con los estándares de los navegadores y luego o bien establecer height para IE solamente a comentarios condicional o anteponiendo el nombre de propiedad con un guión bajo _ por lo IE6 utilizará pero otros navegadores lo ignorarán.

Así que su div sería algo así como 

<div id="mydiv" style="width:500px;min-height:500px;_height:500px;border:4px solid red">

Puede encontrar más información sobre min-height aquí y una rápida Google / Bing búsqueda de min-height IE6 le dará todas las respuestas que necesita.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top