Form Caption

.qtm-form-caption element is a message (hint, error message, counter value, etc) that appears below the inputs.

This is some placeholder help text

<p class="qtm-form-caption">This is some placeholder help text</p>

Sizes

Control the size of a form caption using .qtm-small, .qtm-medium or .qtm-large utilities. By default, the caption has size medium.

This is some placeholder help text

This is some placeholder help text

This is some placeholder help text

<p class="qtm-form-caption qtm-small">This is some placeholder help text</p>
<p class="qtm-form-caption qtm-medium">This is some placeholder help text</p>
<p class="qtm-form-caption qtm-large">This is some placeholder help text</p>

Disabled

Add .qtm-disabled in form caption to disable the element.

This is some placeholder help text

<p class="qtm-form-caption qtm-disabled">This is some placeholder help text</p>

Validation states

Error

Add .qtm-error in caption to changer its color in error state.

The field is required

<p class="qtm-form-caption qtm-error">The field is required</p>

Warning

Add .qtm-warning in caption to changer its color in warning state.

Enter a valid input

<p class="qtm-form-caption qtm-warning">Enter a valid input</p>