css absolute Position innerhalb der relativen Position nicht überlappend

Question

Ich habe Probleme bei dem Versuch, meine Website browserübergreifend zu gestalten. im IE6 habe ich einen Container mit relativer Positionierung, und im Inneren gibt es eine absolute div, die negative oben und links hat, aber anstatt auf der relativen div zu gehen, geht darunter aussehen wie diese:

        ++++++++++++++++++++++
        +     container      +
        +++++++++++++er      +
        +llo        +er      +
        +rld        +er      +
        +++++++++++++er      +
        +     container      +
        +     container      +
        ++++++++++++++++++++++

anstelle von:

        ++++++++++++++++++++++
        +     container      +
  +++++++++++++++++++er      +
  +     hello       +er      +
  +     world       +er      +
  +++++++++++++++++++er      +
        +     container      +
        +     container      +
        ++++++++++++++++++++++

in allen anderen Browser im mit nur statische Positionierung für Container und absolute Position für die Hallo-Welt-Div, und funktioniert ganz gut, aber in IE6 die absolute Div war seltsam Positionierung und egal, wie oben oder links ich gab es nicht bewegen, so dass ich dachte, dies zu tun für IE6, aber im mit das Problem oben beschreiben.

Answer 1

Eine Kombination aus Position relativ und Position absolut:

#container
{
    width: 200px;
    margin: 0 auto;
    position: relative;
}
#content
{
    width: 200px;
    position: absolute;
    z-index: 999;
    left: -100px;
    top: 100px;
}

Demo hier und Screenshot unten:

.

Scheint in IE6+, FF und Chrome zu funktionieren.

Answer 2

Was ist falsch an der Z-Indexierung?

Wenn Sie sich an dem orientieren, was dieser Mann hier getan hat; http://brenelz.com/blog/squish-the-internet-explorer-z-index-bug/

sollte es für Sie gut funktionieren.