Position:relative leaves an empty space

So you want to make your element overlap the first element and don’t  want to use float. Like the image below I have a parent div and a child div. I want the child to have an overlay effect on my parent div. So I use:

#childDiv{

position relative;

}

Then this happen

After moving up my child div I see a space where the child div is left. What to do?

You can use negative value for margin bottom. to push up the margin and move up the space.

#childDiv{

position relative;

margin-bottom: -100px;

}