Explore Courses Blog Tutorials Interview Questions
0 votes
in Web Technology by (20.3k points)

I need assistance with overlaying one individual div over another individual div.

My code looks like this:

<div class="navi"></div>

<div id="infoi">

    <img src="info_icon2.png" height="20" width="32"/>


Unfortunately, I cannot nest the div#infoi or the img, inside the first div.navi.

It has to be two separate divs as shown, but I need to know how I could place the div#infoi over the div.navi and to the rightmost side and centered on top of the div.navi.

1 Answer

0 votes
by (40.7k points)
edited by

Try this code:

#container {

  width: 100px;

  height: 100px;

  position: relative;



#infoi {

  width: 100%;

  height: 100%;

  position: absolute;

  top: 0;

  left: 0;


#infoi {

  z-index: 10;


<div id="container">

  <div id="navi">a</div>

  <div id="infoi">

    <img src="info_icon2.png" height="20" width="32" />b



Related questions

Browse Categories