Make the image height exactly the same as the article?

Question

I would like the height of the image to be adjusted to be identical to the article in such a way that if I add or remove some paragraph the height of the image would increase or decrease equally, something similar to the layout of the illustration below.

An example of code

<div class="flex-container">
  <div class="imagem-container"></div>
  <article class="artigo-container">
    <h1>AQUI TEMOS UM TEXTO GENÉRICO</h1>
    <p>
      E aqui nós também temos outro texto genérico <br>
      E aqui nós também temos outro texto genérico <br>
      E aqui nós também temos outro texto genérico <br>
      E aqui nós também temos outro texto genérico <br>
    </p>
  </article>
</div>

Answer 1

For that, use Flexbox

.flex-container{
  display: flex;
  align-items: center;
 }

And also, don’t leave the image height as fixed.