I have the following structure that I can't change to add or remove elements:
<div class="container"><img src="image.png"><div class="caption">A very long caption that sometimes is much wider than the preceding image.</div></div>
I need to display the caption below the image while preserving the original image size, without stretching the image. If the caption is narrower than the img
everything works well, but if the caption is wider than the image I need it to break to as many lines as needed after reaching the width of the preceding image. Image size can't be hard coded.
I need to achieve this, either using flex or sass, no javascript.