Un enfant peut influencer sa taille de parent en mode standard?
-
19-09-2019 - |
Question
Prenez cette page par exemple, est-il possible d'insérer un enfant dans mydiv telle qu'elle provoquera la hauteur de mydiv de croître au-delà 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>
Je ne peux pas trouver quelque chose qui va. Par exemple, cette situation ci-dessous, je l'ai dit innerDiv à 100% en hauteur. Il trouvera son parent est 500px de hauteur, et donc aussi être 500px de hauteur. Le résultat net est que le contenu est 800px de hauteur, et le contenu se répand au-delà mydiv, avec mydiv encore un grand 500px fidèle:
<!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 en cours d'exécution en mode Quirks provoquera mydiv de grandir pour accueillir ses enfants dans de nombreuses situations. Il semble mode standard ne sera pas explicitement croître. Est-ce toujours le cas?
Je teste ceci principalement dans IE8 et FF3.5 sous Windows, avec IE8 en cours d'exécution dans tous ses modes possibles.
La solution
Non: en mode standard, la propriété par défaut overflow
d'un conteneur doit être réglé sur visible
ce qui signifie que le contenu déborde sera rendu en dehors de la zone de coupe du conteneur. Il n'y a pas cette option overflow
pour développer la taille du conteneur pour correspondre à ses enfants. Vous pouvez voir plus en cas de débordement
Cependant, il existe des méthodes de plus en plus le récipient pour correspondre à la taille de ses enfants. En mode standard, la bonne façon de le faire est de définir la propriété CSS min-height
au lieu de la height
propriété.
Depuis la Hauteur application comportement ne se produit pas dans IE6, les gens finissent par mettre généralement à la fois min-height
pour les navigateurs conformes aux normes, puis soit height
fixé pour IE uniquement avec et un rapide Google / recherche Bing pour min-height IE6
vous donnera toutes les réponses dont vous avez besoin.