Why is there so much space around my modal?

I have a contact form code embedded in a modal on my site. The form is just to collect emails for my marketing so it’s asking for name and email. But the form is so large and I don’t know how to work around it. Basically its adding space all around as if it’s a border or something. Is there a way to make this smaller in webflow?

https://preview.webflow.com/preview/3-paws-marketing?utm_medium=preview_link&utm_source=dashboard&utm_content=3-paws-marketing&preview=eb0597818d476342a164b9815b4564ac&mode=preview

This space is from styles added to the embedded form element you’re using from HoneyBook:

\

You can probably add some custom CSS to your project to overwrite the style that’s constricting the width of the form elements that would look something like the following:

.block-component {
    padding: 20px 0;
}

There also appears to be some space below the form as well that’s occupied by Google’s ReCaptcha content—however even though it’s not visible it’s taking up a decent chunk of the visible space. Unfortunately I don’t believe there is a clean solution like what I mentioned above, so any changes would be forcing the form to appear shorter with overflow hidden.

I checked HoneyBook’s site to see if they had any alternatives available to utilize a default form element with a custom form action link, although the only other option is using contact form hosted on their platform that you link to:

Hopefully that helps :+1:

Thanks for the reply. I was afraid it was HoneyBooks coding but they said it wasn’t. lol I’m not sure how to overwrite their coding as I am not a coder. The space below is what the issue is. It’s throwing my modal off.

For what I’m using the small form for, I want the least amount of clicks as possible so having an external link won’t work for this situation.

Thank you for your reply and checking into this for me.