title: Multiline text overflow hidden with footer
body: <p>Hi there I have a flex container with some elements in it and one of them should be a div with a title, a content composed of an image and a long text, and a footer.</p>
  <p>All of the elements should be the same height and I am experiencing trouble making this precise div the right height. You can check it <a href="https://codepen.io/Mowso/pen/ZEQdvZx" rel="nofollow noreferrer">here</a></p>
  <p>You can see I have a border around my div <code>#article</code> and the text with the footer is crossing it. I would like the text to be like <code>text-overflow: ellipsis;</code> but with no <code>white-space: nowrap;</code> and the footer to be on the border so all children of my flex container</p>