Background-image does not adjust to the width of the surrounding container

I have inserted background-images and want them to grow with the width of the surrounding container. However I have to set a fixed min-height, because when I set it to 100% or auto the container completely collapses to zero pixels. The container always stays at the min-height and so it cannot grow in its width.


The picture shows, that there would be room for the picture to grow, but it doesn’t because it’s restricted to the min-height.

Do you know a solution?


Here is my site Read-Only: Webflow - Andreas Burghart | UX Designer

Live Site: https://andreasburghart.webflow.io/

Any reason why you’re using background images instead of inserting them as actual images?

The DOM won’t react to the size of a background image but if you use an image ( by inserting an image from the Add element pane) it the rest of the document will adjust to fit the image.

Users of screen readers will also benefit as you can add descriptive alt text to an image whereas they’ll not be aware of the image if it’s only a background image.

Thanks for your answer. I couldn’t include images, because I had a weird bug in Webflow, where it was constantly chaning the size of the image. It was the same problem like described in this post: Image bug - Resizing on its own in Designer

So I had to choose background-images.