Растянуть внутреннее содержимое вертикального гибкого бокса

Question

возможно ли растянуть вертикальное содержимое внутренних флексбоксов без использования свойств высоты? Текст в третьей части должен быть растянут для доступного пространства, чтобы предотвратить использование js или фиксированной высоты. Не знаю, возможно ли это только с помощью flexbox. Вот как это должно выглядеть?

ul.itemlist {
  width: 80%;
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-columns: repeat(4,1fr);
  display: grid;
  margin: 0 0 1em;
  padding: 0;
  list-style: none outside;
  clear: both;
  justify-content: flex-start;
}
ul.itemlist li.item {
    position: relative;
    display: flex;
    flex-flow: column wrap;
    
    list-style: none outside;
    border: 1px solid #ccc;

}
ul.itemlist li.item .itempart-wrapper {
  padding: 20px;
}
ul.itemlist li.item .itempart {
  display: block;
  width: 100%;
  margin-bottom: 10px;
  flex: 0 1 auto;
}
ul.itemlist li.item .itempart:last-child {
  margin-bottom: 0;
}
ul.itemlist li.item .itempart.one {
  text-align: center;
}
ul.itemlist li.item .itempart.two {
  font-size: 1.2em;
  font-weight: 600;
}
ul.itemlist li.item .itempart.three {
  flex: 1 1 auto;
}

<ul class="itemlist">
  <li class="item">
    <div class="itempart-wrapper">
      <div class="itempart one"><img src="https://via.placeholder.com/150" /></div>
      <div class="itempart two">Lorem ipsum</div>
      <div class="itempart three">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et</div>
      <div class="itempart four"><a href="">More Details</a></div>
      </div>
  </li>
  <li class="item">
    <div class="itempart-wrapper">
      <div class="itempart one"><img src="https://via.placeholder.com/150" /></div>
      <div class="itempart two">Lorem ipsum</div>
      <div class="itempart three">Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</div>
      <div class="itempart four"><a href="">More Details</a></div>        
    </div>
  </li>
  <li class="item">
    <div class="itempart-wrapper">
      <div class="itempart one"><img src="https://via.placeholder.com/150" /></div>
      <div class="itempart two">Lorem ipsum</div>
      <div class="itempart three">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata</div>
      <div class="itempart four"><a href="">More Details</a></div>
    </div>
  </li><li class="item">
    <div class="itempart-wrapper">
      <div class="itempart one"><img src="https://via.placeholder.com/150" /></div>
      <div class="itempart two">Lorem ipsum</div>
      <div class="itempart three">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat</div>
      <div class="itempart four"><a href="">More Details</a></div>
    </div> 
  </li>
</ul>

РЕДАКТИРОВАТЬ: добавлена ​​забытая обертка itempart