Forms

Forms

With Foundation, we set out to create an easy to handle, powerful and versatile form layout system. A combination of form styles and the Foundation grid means you can do basically anything.

Fieldset

[row]
[one_whole]
Input Label
[/one_whole]
[/row]
[row]

Input Label

Input Label

Input Label

[/row]
[row]
[one_whole]
Textarea Label
[/one_whole]
[/row]

Error States

Foundation includes error states for labels, inputs and messaging that you can have your app generate programatically. You can attach a class of .error either to the individual elements (label, input, small) or to a column/div.

[row]

ErrorInvalid entry

Another ErrorInvalid entry

[one_whole]
Invalid entry
[/one_whole]
[/row]

Custom Forms

It’s so crazy easy to create easy-to-style custom forms. It’s practically a crime.

[row]

Radio Button 1 Radio Button 2 Radio Button 3

Label for Checkbox Label for Checkbox Label for Checkbox

Medium ExampleThis is a dropdownThis is another optionThis is another option tooLook, a third option

Look, a third option

• This is a dropdown
• This is another option
• This is another option too
• Look, a third option

[/row]