Forms in general

This page shows fieldsets and basic layout.

Labels (red) and controls (blue) have a very faint colour background addded to see their extent

A normal fieldset

Standard text field:

Disabled standard text field:

This is an "fnote"

Doubled-up fieldset

Use the classes "flabel2" and "fcontrol2" to have two controls on a row

Standard text field:

Disabled standard text field:

This is an "fnote2"

Forced vertical alignment

By adding "vertical-form" to the surrounding fieldset/div, you can force the labels to sit above the controls, whatever the width

Standard text field:

Disabled standard text field:

A hidden fieldset

By adding "fieldset-hidden" to the surrounding fieldset, you can hide the fieldset border while retaining the spacing it gives (the legend is adjusted to line up with the contents)

Standard text field:

Disabled standard text field: