Hubspot form embed on Firefox doesn't look right

Design help Custom code
1

Hello,

I have a HubSpot form embedded on a popup modal. The width of the form doesn’t look right on the Firefox browser. It looks and works great on Chrome. Would someone be able to look at this and let me know if something needs to be fixed?

Here’s the link to the site - https://elbx-staging.webflow.io/

Thank you so much for your help!

Ravi

Here is my site Read-Only: [LINK][1]
[1]: https://preview.webflow.com/preview/elbx-staging?utm_medium=preview_link&utm_source=designer&utm_content=elbx-staging&preview=0c2088e9049b427316cf75a49ec9b61e&mode=preview

2

@rkoomera - somehow the width of the iframe is being set to 10px:

image
image698×65 12.5 KB

image

My assumption is that HubSpot has some script that determines the height and width of the parent element that it is allowed to use and sets these dynamically on load. I would look at the element it’s being loaded into and what the width of that element is set to.

3

Thank you for looking into this. I’ve looked everywhere in Hubspot but could not find any option to adjust the width. Probably I should take this up with Hubspot directly.

4

@rkoomera - take a look at the answer in this HubSpot community thread:

Can you try loading the forms shell.js script outside of the modal, and calling the hbspt.forms.create() method once the modal is loaded? That seems to work for me. You can also include a target parameter in the form; this parameter is a jQuery selector for the container you want the form to appear in. That should allow you to call the create() method before the modal is opened.