Problems with sign-up button responsiveness when using columns to make the text field adjacent

Design help General
1

I have a signup button that I am trying to design so that the email text field and the submit button are side by side. I have achieved this with columns and padding but this solution performs poorly with responsiveness.

You can see the sign up at the bottom on the right.

Any suggestions on how to achieve the effect I’m looking for here that remains responsive would be amazing!! Thank you!!

Mario

Here is my site Read-Only: LINK

2

Hi @PartnerPage, thanks for for the good question. I would probably recommend to use Flexbox, see example layouts here: Visual CSS flexbox builder | Webflow

It will help with this particular question if you can help to share the Read-only link to the project, see here: Share a read-only link | Webflow University

Thanks in advance,
Dave

3

Thanks Cyberdave - I just learned what a read only link is and I have updated my original post with that link.

I did look at using a Flexbox but it wasn’t clear to me how that would work differently in this case. Thoughts?

Read Only Link to my site: LINK

4

Hmm, what responsiveness issue is there @PartnerPage? If we’re talking about the sign-up box, it seems to work okay for me on mobile. Do you want to keep them side-by-side? You could also just remove the rounded corners on mobile.

5

Using the Flexbox did the trick and then for the smaller formats I centered the sign-up form with email and submit action! IT looks great!