We’re trying to use the `hbspt.forms.create` embed code to embed a Hubspot form on our site. It’s inserting the iframe and applying a bunch of styles; one of which is “height” but it’s being incorrectly calculated so that the bottom of the submit button is being chopped off.
https://jsfiddle.net/sebu4qz2/
Does anyone have a workaround for this?
Hi @JCLyco
It seems that the top margin on the title is not included in the height calculation. You can try to use padding instead and set the top margin to zero:
<h2 style="margin: 0px 0px 12px; padding-top: 36px;">...</h2>
Thanks @paradummy,
Yes I agree that it does seem to be something along those lines.
The styling is added by Hubspot when it does the iframe import and I can’t style the content of an iframe using the parent site CSS. Is there a way to change the CSS in Hubspot? Or would I need to use JS to inject the styles into the frame?
Or is there a way that I can escalate this to Hubspot to fix?
Thanks again for your help.
@JCLyco the styling of the title is probably done directly in the form editor in hubspot. You can open the form in the editor and check the source code of the title field:
