button inside a coloured textbox

Hello, I'm designing a site for a client, and on the homepage I would like to have coloured text boxes overlapping the images with an embedded button. I have currently got the coloured text boxes with a button on top, however when screen size is reduced the text flows behind the button - I'd love for them to scale together. Thanks for your help!

Here's some screen grabs to show what I mean.

Also, while I'm at it - the text becomes enormous when the screen size reduces - is there a way to lock the text size so that it doesn't do this without impacting on mobile optimisation?

Website: https://seadragon-cod-dcdy.squarespace.com/config/pages/website-tools/custom-css

Hi,

Click Our Staff will open a new page or open a popup or open an embed form or?

If open new page

You can add a text and hyperlink it, then I can give you to turn text to button style, so overlap problem won't appear.

If you like this idea, I can give you a quick guide, so you can do it and test

You can use this solution to turn a text in Text Block to button, so overlap problem won't appear.