Formwin - form styles for IE8+

The following form elements showcase Formwon form elements ;)
Dashed lines around form elements are intentionally there (set in demo.css) to show you the actual form element boundaries including labels.
textarea without label and and with placeholder-attribute:

textarea with label above, some text contained, inline css to set size:

textarea with label to the right and in 'positive' state:

textarea with label below and in 'negative' state:

disabled textarea with label to the left:

input[type=text] without label and and with placeholder-attribute:

input[type=text] with label above and some text contained:

input[type=text] with label to the right and in 'positive' state:

input[type=text] with label below and in 'negative' state:

disabled input[type=text] with label to the left:

select without label and nothing selected:

select with label above and moar text in options, 2nd option selected:

select with label to the right, pre-filled value ("One"):

select with label below:

disabled select with label to the left:

checkbox without label:

checkbox with label above, checked:

checkbox with label to the right:

disabled checkbox with label below:

disabled and checked checkbox with label to the left:

radios without labels and nothing selected:

radios with labels above, 2nd one selected:

radios with labels to the right, line breaks added:



radios with labels below, 2nd one disabled:

radios with labels to the left, all disabled, 3rd one selected, line breaks added:




by Rocco, PavingWays