Put div in the background

The ideal would be to give an answer based on your code, however as you did not post (it's the hint for correction), I'll tell you some solutions.

You can have multiple types of position in CSS .

Static

It follows the normal flow of <div> , that is, it works with blocks.

Relative

Accepts properties top , bottom , left and right for placement.

Absolute

Works with <div> and overlays plans. That is, do not ignore physics! It maintains the law that two bodies can not occupy even space and therefore, one overlaps the other.

Fixed

Basically the same thing as absolute , but the element stays fixed all the time on the screen. An example is those% dumpers that overlap all elements and stay fixed even though you use scroll.

Now another topic!

To work with the property in the overlay, we use the property popups that goes from 0 to X and defines which element will be over. Example:

HTML

<div id='primeiraDiv'> ... </div>
<div id='segundaDiv'> ... </div>
<div id='terceiraDiv'> ... </div>

CSS

#primeiraDiv{
z-index: 0;
}

#segundaDiv{
z-index: 1;
}

#terceiraDiv{
z-index: 2;
}

I solved it like this:

The div 02 was inside the div 01, I placed the div 02 out and left the div 01 separate from the div 02:

Before:

<header>
    <div id="topo">
    </div>
</header>

Then:

<div id="fundo">
</div>
<header>
</header>

I added these attributes in the div # background:

position:absolute;
z-index:-1;

And it worked, thank you all!

Ever try to tinker with the z-index of the divs? No css

#div1{
  z-index:20;
}
#div2{
  z-index:30;
}

This positions one over the other. Larger number positions div over