web-dev-qa-db-fra.com

Position absolue et débordement masqué

Nous avons deux DIV, l'une enchâssée dans l'autre. Si la DIV externe n'est pas positionnée en absolu, la DIV interne, qui est positionnée en absolu, n'obéit pas au débordement masqué de la DIV externe ( exemple ).

Y a-t-il une chance de faire que la DIV interne obéisse au trop-plein caché de la DIV externe sans régler la DIV externe en position absolue (cause qui gâcherait notre mise en page complète)? De plus, la position relative de notre division interne n'est pas une option car nous devons "sortir" d'une table TD ( exemple ).

Il y a-t-il des alternatives?

htmlcsslayoutoverflowcss-position
115
Zardoz

Faire l'extérieur <div> à position: relative et intérieur <div> à position: absolute. Il devrait fonctionner pour vous.

254
shankhan

Qu'en est-il de position: relative pour le div extérieur? Dans l'exemple qui cache l'inner. De plus, il ne le déplacera pas dans sa mise en page, car vous ne spécifiez ni haut ni gauche.

24
Tesserex

Un élément absolument positionné est en fait positionné par rapport à un parent relative ou au parent relatif le plus proche trouvé. Donc l'élément avec overflow: hidden devrait être entre relative et absolute éléments positionnés:

<div class="relative-parent">
  <div class="hiding-parent">
    <div class="child"></div>
  </div>
</div>

.relative-parent {
  position:relative;
}
.hiding-parent {
  overflow:hidden;
}
.child {
  position:absolute; 
}
5
Si7ius