For many components, a `label` attribute is available, which place a label in front of the according component. With the `labelLayout` you can adjust this label. The following examples use an inputfield to show, how this works.

Tag Library Documentation: | | |

If the `labelLayout` is not set, the value is 'flexLeft' by default.

    <tc:in label="Input"/>

The value 'none' has the same effect as just not set the `label` attribute.

    <tc:in label="Input" labelLayout="none"/>

The `labelLayout` is set to 'top'.

    <tc:in label="Input" labelLayout="top"/>

    <tc:in label="Input" labelLayout="flowLeft"/>
    <tc:in label="Input" labelLayout="flowRight"/>

    <tc:in label="Input" labelLayout="flexLeft"/>
    <tc:in label="Input" labelLayout="flexRight"/>

The segment layout is divided in two columns. The right one is three times bigger. The 'segmentLeft' and 'segmentRight' put the label in the left or in the right column.

    <tc:segmentLayout medium="3;9">
      <tc:in label="Input" labelLayout="segmentLeft"/>
      <tc:in label="Input" labelLayout="segmentRight"/>
    </tc:segmentLayout>