Back to React Bootstrap

Form text

www/docs/forms/form-text.mdx

2.10.10854 B
Original Source

import FormText from '!!raw-loader!../examples/Form/FormText';

Overview

Block-level help text in forms can be created using <Form.Text>. Inline help text can be flexibly implemented using any inline HTML element and utility classes like .text-muted.

:::tip Associating help text with form controls

Help text should be explicitly associated with the form control it relates to using the aria-describedby attribute. This will ensure that assistive technologies—such as screen readers—will announce this help text when the user focuses or enters the control.

:::

Form text below inputs can be styled with <Form.Text>. This component includes display: block and adds some top margin for easy spacing from the inputs above.

<CodeBlock language="jsx" live> {FormText} </CodeBlock>

API

FormText

<PropsTable name="FormText" />