+ 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?

5th Sep 2019, 2:40 AM

@ifycode

6 Réponses

+ 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;}

7th Sep 2019, 3:27 AM

‎Virat

+ 7

No. Like this: ... <body> <div class ="first"> </div> <div class ="second"> </div> <div class ="third"> </div> </body> ...

5th Sep 2019, 2:51 AM

@ifycode

+ 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).

12th Sep 2019, 4:12 PM

Fredericks

+ 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

12th Sep 2019, 10:15 PM

@ifycode

+ 4

Thanks Virat Kohli. Will alert you once I try it out.

9th Sep 2019, 3:57 AM

@ifycode

+ 2

Is it like this ? <div class="first"> <div class="second"> <div class="third"></div> </div> </div>

5th Sep 2019, 2:44 AM

Uchiha Itachi