Answer the question
In order to leave comments, you need to log in
How can a parent element override a child's pseudo-element?
I want parent to overlap child
<div class="parent">
<div class="child"></div>
</div>
.parent {
width: 100px;
height: 100px;
background: green;
position: relative;
z-index: 100;
}
.child {
position: relative;
z-index: 90;
}
.child:before {
content: "";
position: absolute;
background: red;
width: 50px;
height: 50px;
top: 60px;
left: 60px;
z-index: 10;
}
Answer the question
In order to leave comments, you need to log in
.parent {
width: 100px;
height: 100px;
background: green;
position: relative;
overflow: hidden;
}
.child {
position: relative;
z-index: -1;
}
.child:before {
content: "";
position: absolute;
background: red;
width: 50px;
height: 50px;
top: 60px;
left: 60px;
z-index: 10;
}
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question