About this example
This examples demonstrates a combination of YAML's Form Construction Kit and subtemplates to provide multicolumnar forms.
The provided HTML markup is based on best practices for accessible forms and to allow easy cross-browser styling of all form elements.
For multicolumnar forms (as well as forms in small columns) it is highly recommended to use <form class="full">
for best results.
YAML-based styling multicolumnar forms
There are two ways to create a multicolumnar form. First: You can create multicolumnar fieldsets by putting a subtemplate in your fieldset. Second: You can put a subtemplate in your form and open individual fielsets within the content boxes to create columns. The following example demonstrates both ways.
Multicolumnar Fieldsets
Within a fieldset you can use YAML's subtemplates to divide the available space into columns, right to your need.
Fieldset Columns
The columns are made with subtemplates. In this special example the .subtemplates_oldgecko
class is used, to avoid legends to be clipped in Internet Explorer. The clipping is a side effect of the relative positioning, used in the fieldset/legend fix, and it's recommended if ther is no upper margin or padding defined for your fieldsets. In addition, this subtemplate construction have to be wrapped in a .clearfix
container to avoid clearing problems within the form.