Forms app edited this page Jun 2, 2015 · 12 revisions

Bootstrap provides three types of form layouts:

  • Vertical form (default)
  • Horizontal form
  • Inline form

With Bootstrap grid system you can also create:

  • Multicolumn form
To create multicolumn form with Bootstrap Grid:

Just wrap your form controls (i.e. .form-group, <input>, <textarea>, and <select>) in grid columns.

  1. create grid with desired number of rows
  2. add columns
  3. adjust size of each column and offset when necessary
  4. inside each column add bootstrap form-group for optimum spacing (or form controls)
  5. you can nest the input-group inside of the form-group
  6. remember to change form control default id, type, name (and so on), according to your needs
  7. add submit button, etc...


open screencast in New Window