Styling Your Forms
You have substantial control over the layout, design, and style of your forms.
Access these controls by clicking the gray "Edit" icon that appears when hovering the Form Wrapper.
Form Wrapper:
Layout
The first setting you'll see here is a checkbox labeled "Stretch this Form to fit its container".
With this box checked, your form's width will not be set explicitly.
Rather, your form will "stretch" to fill the "container" it's embedded in (usually an html <div> tag).
This is commonly a better approach than setting your form's width explicitly.
Websites that leverage "responsive design" (layouts that adjust when viewed on laptops, tablets, and phones) can be "broken" by items that require an explicit width. Such an item is unable to be "responsive" on different devices.
Best practice: leave this box checked 🙂
Margin
Use the sliders, or type in values directly to set margin on all four sides of your form.
Padding
Use the sliders, or type in values directly to set padding on all four sides of your form.
Form Layout Settings:
Design
You may set a background and border for your form.
Form Design Settings:
Styles
You have control over
- Font family
- Font size
- Font color
- Letter spacing
...for form fields, typography like headings and paragraphs, buttons, and validation error messages that may appear as prospects interact with your forms.
Buttons provide additional controls for borders and hover states.
Form Style Settings:
