How to make 2 divs (one above the other) the same height?

Question

css

There are two 100% wide divs, one above the other.
How can I make them the same height without js?
Height means the height of the div that is taller.

Answer 1

You put both divs in a block. You give the block such styles.

.block {
  display: grid;
  grid-template-rows: repeat(2, 1fr);
}

https://codepen.io/danil-klimov/pen/VwmEPrq

Answer 2

Push them into one container and set both of them to 50% height, or also through flex, just instead of the flex-basis height.