TUTORIAL HOME
Bootstrap Input Sizing
❮ Previous Next ❯
Input Sizing in Forms
Set the heights of input elements using classes like .input-lg and .input-sm.
Bootstrap Input Sizing
❮ Previous Next ❯
Input Sizing in Forms
Set the heights of input elements using classes like .input-lg and .input-sm.
Set the widths of elements using grid column classes like .col-lg-*and .col-sm-*.
Height Sizing
Small input
Default input
Large input
The following examples shows input elements with different heights:
Example
Default input
input-lg
input-sm
»
You can quickly size labels and form controls within a Horizontal form by adding .form-group-* to the
element:
Example
»
You can also quickly size all inputs and other elements inside an .input-group with the .input-group-sm or .input-group-lg classes:
You can also quickly size all inputs and other elements inside an .input-group with the .input-group-sm or .input-group-lg classes:
Example
»
Column Sizing
col-xs-2
col-xs-3
col-xs-4
The following examples shows input elements with different widths using different .col-xs-* classes:
Column Sizing
col-xs-2
col-xs-3
col-xs-4
The following examples shows input elements with different widths using different .col-xs-* classes:
Example
col-xs-2
col-xs-3
col-xs-4
»
Help Text
Use the .help-block class to add a block level help text in forms:
Example
Password:
This is some help text…
This is some help text…
»
❮ Previous Next ❯
Published
shahzade bau 