2.19 #Components.input Input

Toggle example guides Toggle HTML markup

Basic input component that should be used for email, number, password, tel, text and url inputs. It is also used to apply standard form styling to other components such as textarea, upload and dropdown. If you would like to apply validation styles and messages, check out the Form Control component.

Browser support: IE9+, Safari6+, Firefox30+, Chrome30+

Markup
<label class="sb-label" for="input-id-1">Input Label</label>
<input class="sb-input" id="input-id-1" placeholder="Placeholder Text">
<label class="sb-label" for="input-id-1">Disabled input Label</label>
<input class="sb-input" id="input-id-1" placeholder="Placeholder Text" disabled>
<label class="sb-label" for="textarea-id-1">Textarea Label</label>
<textarea class="sb-input" id="textarea-id-1" placeholder="Placeholder Text"></textarea>
Source: components/_input.scss, line 1