Elementhöhe mit zIndexHTML

HTML-Programmierer
Guest
 Elementhöhe mit zIndex

Post by Guest »

Ich habe Probleme beim Einrichten von Ebenen. Ich habe einen Hintergrund angewendet, der die gesamte Seite abdeckt, aber es kommt zu unerwartetem Verhalten, wenn ich ein Element mit angewendetem Z-Index platziere. Es scheint, dass untergeordnete Elemente innerhalb eines übergeordneten Elements den Z-Index des übergeordneten Elements erben, was Probleme verursacht.
Ist es möglich, Ebenen so zu steuern, dass sich der Hintergrund dazwischen befindet? Eltern und Kind?
Problem:
Nach dem Hinzufügen des zIndex: 8-Stils zum übergeordneten Element, erhöhtes Element befindet sich unter dem Hintergrund. Wenn z-index entfernt wird, funktioniert es wie erwartet
Gewünschtes Verhalten:

Code: Select all

backdropDas 
-Element sollte das übergeordnete Element abdecken, aber das erhöhte Element sollte über dem Hintergrund liegen, wie im Fall von Element-2.

Code: Select all

body {
margin: 0;
background-color: linen;
}

.backdrop {
position: fixed;
width: 100%;
height: 100vh;
background: black;
z-index: 10;
opacity: 0.8;
}

.parent {
background: red;
height: 20vh;
z-index: 8;
position: relative;
}

.elevate-item {
background: cyan;
z-index: 12;
position: relative;
}

.item-2 {
background: green;
height: 20vh;
z-index: 12;
position: relative;
}

Code: Select all



content

Item that should be elevated on top of the backdrop



It works without parent



Sandbox-Beispiel

Quick Reply

Change Text Case: 
   
  • Similar Topics
    Replies
    Views
    Last post
  • Elementhöhe mit zIndex
    by Guest » » in CSS
    0 Replies
    2 Views
    Last post by Guest
  • Elementhöhe mit zIndex
    by Guest » » in HTML
    0 Replies
    2 Views
    Last post by Guest
  • Elementhöhe mit zIndex
    by Guest » » in CSS
    0 Replies
    3 Views
    Last post by Guest
  • Ich kann Zindex von LazyVGrid Element nicht ändern, um es mit Animation auf den Vordergrund zu bringen
    by Guest » » in IOS
    0 Replies
    9 Views
    Last post by Guest
  • Wie stelle ich Canvas.ZIndex so ein, dass ein schwarzes Feld zwischen den Steuerelementen gezeichnet wird?
    by Guest » » in C#
    0 Replies
    13 Views
    Last post by Guest