Auto-changeable widget size (field of chat message)

Hello everyone There is a chat functionality between users. The problem is in the user’s message field, namely that it does not dynamically increase from the size of the text. At first I wanted to increase the message field from the size of the text, but I can’t change the size of the field. Later I made a construction (in the screenshot) of “■■■■ and sticks”, which in theory should have worked the way it should (the main vertical box with size to content enabled).
In general, this works - it increases the message field depending on the size of the text, but a new problem appears. It lies in the fact that there are strange distances between child elements. That is, between those elements that contain little text, the distance between them is as it should be, but for some reason the distance between elements with large text is different, even sometimes child elements climb on top of each other. (In theory, if those fields that get out of bounds would have to be clipped by clipping…)
How is it better to implement the user’s message field in general? Or how can I fix the problem with the distance between child elements, if such a method of auto-expansion of the field (from “■■■■ and sticks”) is acceptable.


image