got a predicament with a name gui, how do i fix?

https://imgur.com/a/wxpEweJ

the imgur link above shows what the problem is better than i can explain here, so i suggest checking that out before reading the rest down below (it's the best summary i could provide without having pictures)

local svh = script.Parent.HandlerPointer.Value


script.Parent.TextButton.MouseButton1Click:connect(function()
    svh:FireServer(script.Parent.TextBox.Text)
end)

I have a 'TextBox' and 'TextButton' inside of the ScreenGui, in order for the player to type their preferred name into the TextBox & to press the TextButton to confirm their name. However, they don't stick in one place. If I minimize the Roblox studio or use a computer with a smaller screen, the buttons move around.

So I put the buttons inside of a Frame, not only because it keeps them in one place but because the other Gui I'm using (a teleporter) is formatted with a Frame so I wanted to keep them similar.

How do I fix this predicament ? Is there something wrong with the LocalHandler script? Is it possible to keep the buttons without moving even if they're not inside the Frame (as the frame being a parent to them) or do I have to fix the script itself? I have no idea how to fix this.