Text is overlapped by sprite

Hello ppl, newbie question.

I need to write a text with some images, the problem occurs when I change the resolution, the text is overlapped by the sprites images.
Is possible the text detect sprite border and make a line feed?.
or how is the correct way of do this?.

I tried to create various TMP components, but when I change the resolution they changes font size individually and make the text looks weird/incorrectly, also of some problems with the screen distribution I preffer use just one TMP component for the screen.

native resolution:
5830348--618292--Screenshot_2.png

another resolution:
5830348--618295--Screenshot_3.png

You should be able to address this by setting up your RectTransform’s position / anchors to be relative and using Layout Components as well.

This would ensure the relationship between these objects would remain consistent regardless of the resolution.

If I understand, what you say is the best way of do this is creating multiple TMP component?

No. One object with a text component and a second object with an image component. Make the image object a child of the text object and then set the anchors of the image object so that is remains at the same relative position to the text object regardless of resolution.