margin top to div inside another div

Question

I have two divs which have background images and I would like to add margin to the the 2nd div but it is creating white space.

How can I add a top margin while keeping the div inside the other div?

<div class="background">
    <div class="logo">
    </div> 
</div>

.logo {
   background-image: url(image/logo2.png);
   height:40px;
   width:400px;
   margin-left:100px;
   display:block;
   margin-top:20px;
}

.background {
   background-image: url(image/empback.png);
   width:100%;
   height:94px;
   min-width:1345px;
}

Answer 1

You can use overflow: auto on the parent element

.background{
    background: #f00;
    width:100%;
    height:94px;
    min-width:1345px;
    overflow: auto;
}

Demo

Just got a link to share which is related to this issue.

---

Also, a better approach towards this is instead of using position: absolute; you should use position: relative; with top, left, right and bottom properties, which will not only keep the element in float, it will also save you from positioning other elements in the same block.

Demo 2