fieldset form width

SOLVE
Occasional Contributor

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!

1 Accepted solution

Accepted Solutions
Highlighted
Occasional Contributor

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.

 

 

3 Replies
Highlighted
Occasional Contributor

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.

 

 

Occasional Contributor

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.

New Member

This code worked for me too. Thanks.

Reply
0 Upvotes