Как один див поставить на другом?

Question

[Lavrov95]

<div class="div1"></div>
<div class="div2"></div>

.div1, .div2 {
   width: 100%;
   height: 200px;
}

Answer 1

[RomanSS]

Если высота фиксированная, тогда можно второму div добавить margin-top: -200px;

Comments

[RomanSS]

https://codepen.io/anon/pen/xNmPqe

Answer 2

[Adik Izat]

<div class="roditel">
   <div class="div1"></div>
   <div class="div2"></div>
</div>

.roditel{
position: relative;
width: 100%;
}
.div1, .div2{
width: 100%;
height: 200px;
}
.div2{
position: absolute;
top: 15px; // насколько отступить сверху
left: 15px; // насколько отступить слева
z-index: 100;
}

Answer 3

[Danil Klimov]

Либо:

.div2 {
  position: relative;
  top: -200px;
}

Но тогда нужно учитывать что между div2 и последующим блоком (например div3) будет дыра в 200px

Либо:

.div1, .div2 {
  width: 100%;
  height: 200px;
  position: absolute;
}

В таком случае естественно должен быть родитель с position: relative