text on top of the image using grid

1.container {
2  display: grid;
3  max-width: 700px;
4}
5
6img {
7  grid-column: 1;
8  grid-row: 1;
9  width: 100%;
10}
11
12.caption {
13  font-family: sans-serif;
14  padding-left: 1em;
15  line-height: .9em;
16  background: rgba(0, 0, 0, .3);
17  color: #fff;
18  height: 90px;
19  grid-column: 1;
20  grid-row: 1;
21  z-index: 1;
22}