# Reference table

<div class="Vlt-table Vlt-table--data">
|Class |	Behaviour|
|---|---|
|`.Vlt-form__element`| Wraps every form element|
|`.Vlt-form__element--error`| Additional way to add the error styles to a field|
|`.Vlt-form__element--valid`| Adds the valid style to a field. This is optional, only add it if agreed with your designer|
|`.Vlt-form__element__error`| Wraps the error message below the field. It adds the red style and icon|
|`.Vlt-form__element--elastic`|	Adds width: auto to select and input fields. Useful for quantity or title fields |
|`.Vlt-form__element__hint`| If the field has a hint, this wraps it to give it the right styles|
|`.Vlt-input`| Wraps every input field|
|`.Vlt-select`| Wraps every select|
|`.Vlt-textarea`| Wraps every text area|
|`.Vlt-composite`| Adds styles to the input and surrounding elements in composite fields|
|`.Vlt-composite--appendedicon`| Modifier needed to append icons to an input|
|`.Vlt-composite__prepend`| Wraps the element prepended to the input in composite fields|
|`.Vlt-composite__prepend--icon`| Modifier for a prepended element containing an icon (NOT a button with an icon in it). It gives it absolute positioning and gives the actual input the appropriate left padding. This is not suppossed to be clickable, it's meant to be decorative|
|`.Vlt-composite__append`| Wraps the element appended to the input in composite fields|
|`.Vlt-composite__append--icon`| Modifier for an appended element containing an icon (NOT a button with an icon in it). It gives it absolute positioning and gives the actual input the appropriate left padding. Can't be used for selects and must be used in conjunction with the modifier Vlt-composite--appendedicon|
|`.Vlt-form__group`| Wraps a form group, which usually contains multiple form elements and possibly a button. This is different from putting multiple form elements in a grid because of the spacing between elements|
|`.Vlt-form__group--inline`| Gives display: inline-flex to the form group|
</div>