オーバフローオートで絶対配置されたdivは、子絶対divを切り捨てるようにします。

Question

私はオーバフローオートで絶対配置divを持っています。このdivの中にもう1つ絶対配置されたdivがあります。私の問題は、この子divがオーバーフローのために切断されるということです。オーバーフローが設定されていない場合、コンテナdivからエスケープしたいと思います。私はzインデックスを設定しようとしましたが、それは役に立ちません。私に何ができる？

HTML

<div class="parent"> 
    <div class="child"></div> 
</div> 

CSS

.parent { 
    position:absolute; 
    z-index:0 
    overflow:auto; 

    width:400px; 
    height:400px; 

    border:1px solid #000; 
} 

.child { 
    poisiton:absolute; 
    z-index:1 

    width:300px; 
    height:450px; 

    border:1px solid #f00; 
} 

Answer 1

あなたには、いくつかの要素が親をオーバーフローさせないようにいくつかの要素ではないしたい場合は、現在の子を配置したほうが良いと思います現在の親の外側のdiv。ちょうどそれを絶対的に位置づけられた同輩にしてください。

Answer 2

フロートをクリアする別の方法に頼ることができるかどうかを参照してください。 CSSをoverflow: visibleに変更することは間違いなく良い解決策です。

<div class="container"> 
    <div class="parent"> 
    </div> 
    <div class="child"> 
    </div> 
</div> 

CSS：

.container { 
    /* apply positioning from .parent */ 
} 
.parent { 
    position: absolute; 
    top: 0; 
    left: 0; 
} 
.child { 
    /* apply positioning from .child */ 
}