Bootstrap/docs/components/label.md

layout	title
page	Labels

Small and adaptive tag for adding context to just about any content.

Example

Labels scale to match the size of the immediate parent element by using relative font sizing and em units.

{% example html %}

Example heading New

Example heading New

Example heading New

Example heading New

Example heading New

Example heading New

{% endexample %}

Contextual variations

Add any of the below mentioned modifier classes to change the appearance of a label.

{% example html %} Default Primary Success Info Warning Danger {% endexample %}

Have tons of labels?

Rendering problems can arise when you have dozens of inline labels within a narrow container, each containing its own inline-block element (like an icon). The way around this is setting display: inline-block;. For context and an example, see #13219.