flex 布局如何让两个元素自动占满高度？

[真的还是假的]

如图，是一个列表项，这个列表项里面，list-item 的高度是固定的，但是里面的图片和内容高度不固定，用样式如何做到不限定高度的情况下，让 img 和 p 自动填满 list-item呢？

<div class="list-item">
  <!-- 封面 -->
  <img src="" alt="">
  <!-- 内容 -->
  <p>卡片内容</p>
</div>

[songjinzang14]

.list-item {
  display: flex;
  /*这个属性可以让内容上下铺满*/
  align-items: stretch;
}