+ 5
Say there are 3 parent divs nested in the body. How do one make the 2nd div sit under the 1st, and the 3rd sit under the 2nd?
6 Answers
+ 8
May be this one satisfy your question.
CSS file
.first{width:120px;height:120px;background:red;}
.second{width:120px;height:120px;background:yellow;
position:absolute ;top:50px;left :50px;}
.third{width:120px;height:120px;background:green;
position:absolute ;top:100px;left :100px;}
+ 7
No. Like this:
...
<body>
<div class ="first">
</div>
<div class ="second">
</div>
<div class ="third">
</div>
</body>
...
+ 6
To make elements "sit" on or overlap the other, all you've gotta do is add position: relative; or position: absolute; to them and use z-index to decide which gets to stay on top (high z-index value) and which get casted behind (lower z-index value).
+ 5
Virat Kohli I've been able to apply the positioning in my newest code upload. Although I used it on pseudo elements, I think I understand how it works for divs. Thanks a lot.
I'm yet to study z-index though Fredericks
https://code.sololearn.com/WM3c5j8HZL21/?ref=app
+ 4
Thanks Virat Kohli. Will alert you once I try it out.
+ 2
Is it like this ?
<div class="first">
<div class="second">
<div class="third"></div>
</div>
</div>
Often have questions like this?
Learn more efficiently, for free:
