Wie erbt ein Div mit fester Position die Breite seines übergeordneten Elements?

Relative Breite des positionierten festen Div

Beim Versuch, ein Div mit fester Positionierung auf die volle Breite seines übergeordneten Divs festzulegen, treten einige Herausforderungen auf entstehen kann. Lassen Sie uns das Problem untersuchen und eine Lösung finden.

Problembeschreibung

Im bereitgestellten Beispiel erbt ein Div mit der festen Position nicht die Breite seines übergeordneten Elements. Stattdessen erstreckt es sich auf die Breite des gesamten Fensters.

Lösung

Um dieses Problem zu beheben, wenden Sie die CSS-Eigenschaft width: inherit auf alle inneren Divs innerhalb des übergeordneten Divs an . Dies weist das feste Div an, seine Breite von seinem übergeordneten Div zu erben.

#container {
    width: 800px;
}

#fixed {
    position: fixed;
    width: 100%;
}

#fixed div {
    width: inherit;
}

Implementierung

Für Browser, die width: inherit nicht unterstützen, sollten Sie die Verwendung einer JavaScript-Lösung in Betracht ziehen . Dies kann bei älteren Browsern erforderlich sein.

Das obige ist der detaillierte Inhalt vonWie erbt ein Div mit fester Position die Breite seines übergeordneten Elements?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!