Inline Help

Inline help is used to display help text in a popover, often inline with headers, body text and form labels.


Default Position

The default positioning of inline help component is bottom right.

Lorem ipsum dolor sit amet, consectetur adipiscing. 
<span class="fd-inline-help">
    <span class="fd-inline-help__content fd-inline-help__content--bottom-right">
        Lorem ipsum dolor sit amet, consectetur adipiscing.
    </span>
</span>


Bottom Left Position

Lorem ipsum dolor sit amet, consectetur adipiscing. 
<span class="fd-inline-help">
    <span class="fd-inline-help__content fd-inline-help__content--bottom-left">
        Lorem ipsum dolor sit amet, consectetur adipiscing.
    </span>
</span>


Bottom Center Position

Lorem ipsum dolor sit amet, consectetur adipiscing. 
<span class="fd-inline-help">
    <span class="fd-inline-help__content fd-inline-help__content--bottom-center">
        Lorem ipsum dolor sit amet, consectetur adipiscing.
    </span>
</span>


Right Position

Lorem ipsum dolor sit amet, consectetur adipiscing. 
<span class="fd-inline-help">
    <span class="fd-inline-help__content fd-inline-help__content--right">
        Lorem ipsum dolor sit amet, consectetur adipiscing.
    </span>
</span>


Left Position

Lorem ipsum dolor sit amet, consectetur adipiscing. 
<span class="fd-inline-help">
    <span class="fd-inline-help__content fd-inline-help__content--left">
        Lorem ipsum dolor sit amet, consectetur adipiscing.
    </span>
</span>