fieldset form width

[jcole]

The form I am using for one of our landing pages is not wanting to display at 100% width when I set a few of the fields to stand side-by-side.

I am able to find an inline stylesheet when insepcting the published page that will allow the side-by-side fields to display at 100%, but I can't seem to find where the style sheet is located. The class that shows up is an .hs fieldset, but it is specific to the field itself.

Thanks!

[jcole · Accepted solution]

Found it. The stylesheet we were using as a template was missing the follwing:

.hs-form fieldset {
max-width: none!important;
}

I just added it just before the max widths were being set for the different form columns. 

And just a side-note, even when I removed all of the stylesheets and disabled our defaults, the problem still persisted.

[hellraizer]

Unfortunately, this is not accessible unless you pay for the pro version. Forms are limited to 500 pixels max-width unless you pay.

[Artesano_Studio]

This code worked for me too. Thanks.

[DrFriedParts]

You couldn't find the stylesheet because there isn't one. The styling on the fieldsets is added by their javascript code and it ignores their JSON configuration object's 'css' property. As this mechanism to configure the embedded form appears to be recent, I'm sure they'll fix this bug soon. In the mean time, your code is the only approach that will work (it just overrides their rendered css).

The Hubspot form embed script injects this style sheet directly into the page:

<style type="text/css" id="hs-form-style....

It's not an external stylesheet so it doesn't show-up in it's own network transaction... and it violates how Hubspot promises the script should work here. Basically, it's a bug.