Absolute Positionierung und Ausblenden des Überlaufs

Question

Wir haben zwei DIVs, eines in dem anderen verschachtelt. Wenn das äußere DIV nicht auf absolute Positionierung festgelegt ist, berücksichtigt das absolut positionierte innere DIV nicht die Überlaufausblendung des äußeren DIV.

#first {
    Breite: 200px;
    Höhe: 200px;
    Hintergrundfarbe: grün;
    Überlauf versteckt;
}

#zweite {
    Breite: 50px;
    Höhe: 50px;
    Hintergrundfarbe: rot;
    Position: absolut;
    links: 250px;
    oben: 250px;
}

<div id="first">
    <div id="second"></div>
    <div id="third"></div>
</div>

Gibt es eine Möglichkeit, dafür zu sorgen, dass das innere DIV dem Überlaufverstecken des äußeren DIV folgt, ohne das äußere DIV so festzulegen, dass es absolut positioniert ist (da dies unser Gesamtlayout zerstören würde)? Außerdem ist die relative Positionierung für unseren inneren DIV keine Option, da wir einen Tabellen-TD „hervorheben“ müssen.

#first {
    Breite: 200px;
    Höhe: 200px;
    Hintergrundfarbe: grün;
}

#zweite {
    Breite: 50px;
    Höhe: 400px;
    Hintergrundfarbe: rot;
    Position: relativ;
    links: 0px;
    oben: 0px;
}

<table id="first">
    <tr>
        <td>
            <div id="second"></div>
        </td>
    </tr>
</table>

Gibt es noch andere Möglichkeiten?

Answer 1

关于外部div使用position: relative呢？在隐藏内部div的例子中。由于没有指定top或left，它也不会在布局中移动。

Answer 2

将外部的 <div> 设置为 position: relative，将内部的 <div> 设置为 position: absolute。这样应该适用于您。