Element mit z Index -1 geht unter Großeltern div

Putting z-index:-1 in absolute-Kind machen die Div unter den Großeltern. Wie mache ich Absolute-Kind unter die Eltern-Div gehen nicht die Großeltern div?Element mit z Index -1 geht unter Großeltern div

.grandparent{ 
 
    background:rgba(0, 128, 0, 0.89); 
 
    width:500px; 
 
} 
 

 
.parent{ 
 
    position:relative; 
 
    width:200px; 
 
    height:200px; 
 
    background:yellow; 
 
} 
 

 
.absolute-child{ 
 
    position:absolute; 
 
    width:100px; 
 
    height:100px; 
 
    background:red; 
 
    top:10px; 
 
    right:-50px; 
 
    z-index:-1; 
 
}

<div class="grandparent"> 
 
    <div class="parent"> 
 
     <div class="absolute-child"> absolute ch 
 
     </div> 
 
     <div class="siblings">siblings</div> 
 
    </div> 
 
</div

Quelle

2017-10-04 Ismail Rubad

Wenn Sie meine Antwort hilfreich gefunden, bitte markieren Sie ihn als Scheck (hilfreich) –

@AwsmeSandy Können Sie es ein wenig für mich erklären? Oder schlage mir einen Artikel vor, um mich verständlich zu machen. –

Wenn Sie mit dem Z-Index mit zwei Elementen spielen, können Sie dem Elternteil auch den Z-Index geben, sodass der Großeltern-Z-Index als Basis für die untergeordneten divs dient. –

Hier ist, was Sie wollen, hinzugefügt position: relative; zum granparent so die z-index: 0; für sie zu arbeiten.

.grandparent{ 
 
    background:rgba(0, 128, 0, 0.89); 
 
    width:500px; 
 
     z-index: 0; 
 
    position: relative; 
 
} 
 

 
.parent{ 
 
    position:relative; 
 
    width:200px; 
 
    height:200px; 
 
    background:yellow; 
 
} 
 

 
.absolute-child{ 
 
    position: absolute; 
 
    width: 100px; 
 
    height: 100px; 
 
    background: red; 
 
    top: 10px; 
 
    right: -50px; 
 
    z-index: -1; 
 
}

<div class="grandparent"> 
 
    <div class="parent"> 
 
     <div class="absolute-child"> absolute ch 
 
     </div> 
 
     <div class="siblings">siblings</div> 
 
    </div> 
 
</div

Quelle

2017-10-04 07:13:47

Element mit z Index -1 geht unter Großeltern div

Antwort

Verwandte Themen