<div class="photo-wrap">
  <img class="photo" src="https://via.placeholder.com/800x400" alt="">
  <div class="photo-caption">Описание картинки...</div>
</div>
.photo-wrap{
  position:relative;
}
.photo{
  width:100%;
  display:block;
}

.photo-caption{
  background:red;
  width:400px;
  padding:15px;
  position:absolute;
  bottom:0;
  left:50%;
  transform:translate(-50%,50%);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.