When using the embed code it creates an iframe. But it is not possible to apply a styling on elements within an iframe. I know that I can remove the hubspot styling with the property css: ‘’ but that does not help, if I can’t apply my own styling.
It will use javascript to create your form on an external site. You should remove the styling on the form, as you mentioned, but then you’ll need to add references to your CSS file.
I already found this posts. What I don’t understand, is, how to correctly apply the css classes. It is not possible to style elements within an iframe. When I click on ‘embed code’ I don’t have the checkbox ‘Include default styling’ so maybe there is the problem?
Should the form, if not included with default styling (checkbox unchecked), be embedded without an iframe?
EDIT: I somehow overlooked, that the custom form styling is only possible with Marketing Hub Basic or higher and I am using the free version right now.
I’m not certain why you wouldn’t have the option to include default styling. [Edit: per your response, you aren’t seeing this because you are using Marketing Free. Following is still relevant to users running into this issue (not on free).]
When adding the references to your CSS file, be sure that they are in a spot where they are loading last and not being overwritten. I have also found it necessary on some sites to add !important after the declaration.