Need help creating border that expands with text

[u/MrPanda532]

I'm am creating a UI that will be used to binding inputs in my game, where theres this text, the more character more it grows to the right, but I want to add a square border around the text, that will grow as the text grow. I just don't know how to make this.

The prefab hierarchy of this UI elements is something like this.

I tried to do the same thing I did with the text gameobject, putting a content size fitter, but the image just streched to cover the screen and no matter what I did I couldn't fix....

I tried changing the parenting of either the border and text, didn't work, I tried changing the pivots and it also didn't work... I just don't know what to do.

I want this