Do you know how to arrange forms?

Last updated by TiagoAraujo about 7 years ago.See history

There are two ways of arranging labels and inputs on an html form, but each should be used in a specific scenario.

When arranging labels and inputs on your html form, align labels next to the inputs on medium and large displays.

forms desktop
Figure: Labels besides their respective inputs on regular displays

When arranging labels and inputs on your html form, align labels above inputs on small and extra-small displays.

forms mobile
Figure: Labels above their respective input on smaller displays

Bootstrap makes this easy. Read Do you use the css class "form horizontal" to arrange your fields and labels? to know more.

We open source. Powered by GitHub