Text determine height of image collection item

How do I get the text height of a collection item to determine the height of the image.

This is what I’m trying to achieve: https://www.mckinsey.com/
(Three stories below the top section.)

Image width is always 50% of the screen, but the image height adjusts to the text height.

Set the height of the collection item div to auto, it will expand with the text height automatically, since texts do have intrinsic height, while the image must be with height: 100% and possibly with a object-fit cover

But then, won’t the height of the collection item adjust to text or image, depending of which of the two is the highest?

I want the text height to be the dominant always.

So when the screen gets wider, I want the image width to be 50% of the screen, but the height to be dominated by the height of the text.

no if you set the image to height: 100% inside a div that is auto, the image would not have any intrinsic height

I don’t get to work.
I must add that this is a collection list with image and text changing side for every new post.
That gives me some restrictions on what to do, I think. :roll_eyes:

Have a look if you’d like: