Tags
Layout for tagged content.
Basic Tag Example
Blueberry
<span class="tag">Blueberry</span>Tag with Color & Close
Blueberry
<span class="tag bg-primary">Blueberry <i class="fas fa-xmark"></i></span>Tag Group Example
When you want to display more than one tag, wrap the tags in a tag-group container.
This will apply consistent spacing around your tags.
Strawberry
Lime
Lemon
Blueberry
Strawberry
Lime
Lemon
Blueberry
Strawberry
Lime
Lemon
Blueberry
<div class="tag-group">
<span class="tag bg-danger">Strawberry <i class="fas fa-xmark"></i></span>
<span class="tag bg-success">Lime <i class="fas fa-xmark"></i></span>
<span class="tag bg-warning">Lemon <i class="fas fa-xmark"></i></span>
<span class="tag bg-primary">Blueberry <i class="fas fa-xmark"></i></span>
<span class="tag bg-danger">Strawberry <i class="fas fa-xmark"></i></span>
<span class="tag bg-success">Lime <i class="fas fa-xmark"></i></span>
<span class="tag bg-warning">Lemon <i class="fas fa-xmark"></i></span>
<span class="tag bg-primary">Blueberry <i class="fas fa-xmark"></i></span>
<span class="tag bg-danger">Strawberry <i class="fas fa-xmark"></i></span>
<span class="tag bg-success">Lime <i class="fas fa-xmark"></i></span>
<span class="tag bg-warning">Lemon <i class="fas fa-xmark"></i></span>
<span class="tag bg-primary">Blueberry <i class="fas fa-xmark"></i></span>
</div>