<div class="flex-container">
  <div class="flex-row">
    <div class="flex-item">
      <img src="https://baconmockup.com/400/300" alt="Bacon">
    </div>
    <div class="flex-item">
      <h1>Text Container</h1>
      <p>Bacon ipsum dolor amet cupim kevin ham chislic swine brisket. Meatball picanha tenderloin, drumstick beef sausage porchetta ribeye pork turducken. Ball tip pig chicken buffalo chislic venison flank bacon andouille. Shank venison buffalo, t-bone brisket beef pork chop sausage meatball bresaola pork belly. Bacon frankfurter drumstick pork meatloaf short loin pork loin hamburger corned beef beef ribs cow chislic chuck.</p>
    </div>
  </div>
</div>
<p><a href="https://www.sitepoint.com/community/t/image-in-flexbox-keeps-shrinking-down-unwanted/362213?u=sama74">https://www.sitepoint.com/community/t/image-in-flexbox-keeps-shrinking-down-unwanted/362213?u=sama74</a></p>

    * { 
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      outline: 1px red dotted;
    }
    
    .flex-container {
      max-width: 960px;
      margin: 50px auto;
      align-items: stretch;
    }

    .flex-row {
      display: flex;
      background-color: blueviolet;
    }

    .flex-item {
      flex: 1 0 ;
      display: flex;
      flex-direction: column;
    }

    .flex-container img {
      display: block;
      background: #666;
      object-fit: cover;
      flex: 1 0 200px; /* Adjust "target" flex-basis height to suit */
    }

    @media screen and (max-width: 500px) {
      .flex-row {
        flex-direction: column;
      }
    }