<style type="text/css">
.a {
border: 1px solid #000;
position: relative;
}
.b {
background: #F93;
position: absolute;
top: 50px;
left: 50px;
}
</style>
<div class="a">
<div class="b">test</div>
</div>
La hauteur de a ne s'auto-dimensionne pas avec son contenu (beause b a flow), mais comment résoudre ce problème, utilisez css possible, pas javascript.div n'est pas autororesize avec le contenu absolu div
Essayez "float: left;" dans les deux classes. N'a pas testé, cependant. Dans quel navigateur testez-vous?
Si vous attendez de voir votre redimensionnement a-div, alors je pense que vous avez mal compris quelque chose. Lorsque vous définissez un élément comme absolu, vous le sortez du "flux de rendu", ce qui signifie qu'il n'interfère pas avec les autres éléments de la page.
ouais, vous avez raison, b a été coulé, maintenant j'ajoute la position: par rapport à un, laissez b mise en page par un, toute méthode avec css peut résoudre ce problème? –
Je ne suis pas sûr de ce que vous essayez d'atteindre, mais vous pouvez essayer la solution de Greg, en supprimant 'position: absolute' et en mettant' margin-left' et 'margin-top' au lieu de' left' et 'top' . De cette façon, b-div déciderait de la taille de a-div. – peirix
Si div b est positionné en absolu, il n'est plus considéré comme 'inside' car il n'est pas rendu à l'intérieur de celui-ci.
si div un ne redimensionne pas comme div b grossit ou smalller ...
vous ne pouvez pas le résoudre avec css, mais js –
oui je le fais, ce n'est pas possible avec css seul ... – NDM
En définissant position: absolute vous prenez la div en dehors du flux normal du document, ce qui est la raison pour laquelle le conteneur ne redimensionne pas contenir il. Voulez-vous régler margin-top: 50px; margin-left: 50px; à la place?
Mais ceci est la méthode ne pas préfet, si la hauteur de b inconnue ou redimensionner par son contenu, de sorte vous devriez redimensionner margin-top, js can, mais css ne peut pas. Merci beaucoup –
Dans le modèle de positionnement absolu, une case est explicitement décalée par rapport à son bloc conteneur. Il est entièrement retiré du flux normal (il n'a aucun impact sur les frères et sœurs plus tard). Une case positionnée en absolu établit un nouveau bloc conteneur pour les enfants à flux normal et les descendants positionnés de manière absolue (mais non fixe). Cependant, le contenu d'un élément absolument positionné ne circule pas autour d'autres cases. Ils peuvent masquer le contenu d'une autre boîte (ou être eux-mêmes masqués), en fonction des niveaux de pile des boîtes qui se chevauchent.
Vous consultez la documentation suivante: Absolute positioning
Lorsque vous avez une division avec position: relative, vous pouvez contrôler tout élément absolu à l'intérieur. En fait, Div absolu est hors du flux du document normal comme Greg mentionné ci-dessus. Comme je vous vois mettre à gauche et en haut pour b, puis si vous définissez la largeur de a à 60px comme ça. Votre est en dehors de la zone parent. C'est ainsi que fonctionnent les éléments absolus.
tous les navigateurs modernes –