How to fix overlapping text on smaller screens? (It looks good on bigger screens)

Design help General
1

Hi, I have published my site recently and I came across a very peculiar problem.
On the Teams Page there is a section where some pictures are next to some text.
So on a bigger screen you don’t have this overlapping problem but smaller screens do have this issue.

This is what I mean:

image
image1824×853 145 KB

This is my screen which I guess is slightly bigger than normal.

image
image1063×812 100 KB

This is the published site on a smaller laptop screen.

Does anyone know how to fix this overlapping problem for smaller screens?

https://preview.webflow.com/preview/traffic-more?utm_medium=preview_link&utm_source=designer&utm_content=traffic-more&preview=f20c1bebfd9ba19016aaf87bff68f17e&pageId=60da25353058163b7d2d63fd&workflow=preview

2

Hi @Mourik, there are several ways to “solve” this. It really depends on your desired outcome. Do you want to scale down the image? or perhaps you want to make the test smaller?

3

Hi Dennyhartanto, I tried making the image smaller. The result is that the image is a bit too small on a big screen.
What do you mean with making the test smaller?
I am open to everything as long as it looks hopefully good on both big and smaller screens!