在flex内包含div

Question

我正在尝试使用绝对值使一个div包含在另一个div内，但是当我添加100％的高度和宽度时，它的大小是其主体大小而不是其所包含的div的100％的高度和宽度，因此我不能将div放置在其所在的div的底部。

有人知道我在这里面临的问题的解决方案吗？

  .row {
  width: 80%;
  max-width: 1425px;
  margin: 0 auto;
  padding: 50px 0px;
  display: flex;
}

.column {
  flex: 1;
}

.halves {
  display: flex;
  justify-content: space-between;
}

.halves .column {
  width: 50%;
}

.p1 {
  height: 600px;
}

.sand {
  background-color: #e4c8b8
}

img {
  max-width: 100%;
  max-height: 100%;
 }
  
.info {
position: absoulute;
width: 100%;
height: 100;
bottom: 10px;
right: 10px
}

<div class="row halves">
  <div class="column sand p1">
    <img src="https://imgur.com/kgbkNDy.png" />
    <div class="info">
      <h3>Project one</h3>
    </div>
  </div>
</div>

Answer 1

将position: relative;添加到要指定大小的元素。