title: Equal height flex items when inner content has different height
body: <p>I need columns that will have the same height, so I used flex (I use bootstrap framework).</p>
  <p>I know that flex work can be seen in the attached picture, but the height of the boxes is not the same, by the fact that one is less text than the other.</p>
  <p><a href="https://i.stack.imgur.com/y0HNG.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/y0HNG.png" alt="enter image description here" /></a></p>
  <p><a href="https://i.stack.imgur.com/iG9pg.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/iG9pg.png" alt="enter image description here" /></a></p>
  <p>I want class <code>inner-div</code> to match to the height of <code>col-md-4</code>.</p>
  <p>Can someone help me adjust the height so that it is always the same?</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.col-md-4 {
    border: 1px solid black;
  }
  .row-eq-height {
    display: flex;
  }
  .inner-div {
    border: 1px solid red;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="container"&gt;
    &lt;div class="row row-eq-height"&gt;
      &lt;div class="col-md-4"&gt;
        ddddddsadddddddsadddddddsadddddddsa
        &lt;br&gt;ddddddsadddddddsadddddddsadddddddsa
        &lt;br&gt;ddddddsadddddddsadddddddsadddddddsa
        &lt;br&gt;
        &lt;div class="inner-div"&gt;
          adsadadadada
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-md-4"&gt;
        ddddddsadddddddsadddddddsadddddddsa
        &lt;div class="inner-div"&gt;
          asdadadaada
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-md-4"&gt;
        ddddddsadddddddsadddddddsadddddddsa
        &lt;br&gt;ddddddsadddddddsadddddddsadddddddsa
        &lt;br&gt;ddddddsadddddddsadddddddsadddddddsa
        &lt;br&gt;
        &lt;div class="inner-div"&gt;
          asdadaadas
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>