problema overflow con elementi "position absolute"

[ilmandorlone]

salve a tutti..
ho un problema con css:
ho creato un div "contenitore" con (overflow: hidden) e dentro il contenitore ho degli elementi con (position: absolute) il problema è che l'overflow del contenitore non ha effetto sull'elemento quindi lo visualizzo per intero anche se questo esce dai parametri del contenitore.
un esempio che ho trovato:

<div style="width:100px; height: 100px; border:1px solid; overflow:hidden; "><br/>
    <div style="position:inherit; width: 200px; height:200px; background:yellow;"><br/>
        <div style="position:absolute; width: 500px; height:50px; background:Pink; z-index: 99;"><br/>
        </div>
    </div>
</div>

vorrei che l'elemento mantenesse una posizione assoluta nel contenitore ma che non venisse visualizzato al di fuori dal contenitore stesso.. come posso fare? grazie ..

 

[marcoint]

Se hai impostato per gli elementi di sopra una width di 100px 200px e di 500px è normale che venga sballato. La width dovrebbe esere uguale per tutti e se li vuoi avere allineati, mentre è l'altezza ( height ) che devi cambiare se vuoi.

 

[flameseeker]

vorrei che l'elemento mantenesse una posizione assoluta nel contenitore ma che non venisse visualizzato al di fuori dal contenitore stesso.. come posso fare? grazie ..

Ciao!
Dovresti dare position:relative; al contenitore

 

[T3KN]

Ciao!
Dovresti dare position:relative; al contenitore

esatto ...