Почему не работает overflow?

Question

[Алексей Мирошниченко]

Почему overflow: hidden не скрывает картинки, которые выходят за пределы родительского блока?

<div class="slider">
  <div class="item"><img src=".jpg" alt="123"></div>
  <div class="item"><img src=".jpg" alt="123"></div>
  <div class="item"><img src=".jpg" alt="123"></div>
</div>

.item {
  position: absolute;
  top: 200%;
}
.slider{
  height: 800px;
  overflow: hidden;
}

https://codepen.io/MuzZone/pen/ZaKdOd

Answer 1

[Павел Александров]

Поставь у .slider
position: relative;
Иначе .item позиционируется относительно body.