HTML blocks of the same height in a line how to do?

Question

css

In general, the essence of the problem is that you need to layout the block so that the blocks in the line are the same height, the layout must be adaptive and fluid, 3 columns, 2 columns and 1 column,
I would like to look at a solution without JS, support for ie 7+

Answer 1

flex-box
display: table > display: table-cell

Answer 2

As promised, I’ll tell you about the solution I found, of course this is a crutch, but nothing else came to mind, how to make every second and third element insert another 1 side element
In my case, this

<!--Сплитер для 3 плиток в ширину-->
          <div class="news-list-hr-3">
            <div class="news-list-hr-3__item">
              <div></div>
            </div>
            <div class="news-list-hr-3__item">
              <div></div>
            </div>
            <div class="news-list-hr-3__item">
              <div></div>
            </div>
          </div>

and

<!--Сплитер для 2 плиток в ширину-->
          <div class="news-list-hr-2">
            <div class="news-list-hr-2__item">
              <div></div>
            </div>
            <div class="news-list-hr-2__item">
              <div></div>
            </div>
          </div>

You can look at the full solution on Bitbucket
or on the site (although I don’t know how much more will lie there)
I also don’t mind hearing your opinion about the approach and layout in general.