
Navigation
Theme components
Form components
Apps
Documentation
Single line list
Use the .list-group-item
class with any a, button or li
element inside a .list-group
element.
Single line compact list
Use the .list-group-item
class with any a, button or li
element inside a .list-group.bmd-list-group-sm
element.
Double line list
Use the .bmd-list-group-col
class inside the .list-group-item
for double line lists.
List group item heading
Some text
List group item heading
Some text
List group item heading
Some text
Double line compact list
Add the .bmd-list-group-sm
class to the .list-group
and use the .bmd-list-group-col
class inside the .list-group-item
for compact double line lists.
List group item heading
Some text
List group item heading
Some text
List group item heading
Some text
Lists with icons, images or tags
Add icons and tags to the .list-group-item
and combine it with the .bmd-list-group-col
class for lists with icons, images or tags.
List group item heading
Icon left
List group item heading
Tag to the left
List group item heading
Image to the left
List group item heading
Icon right
List group item heading
Tag to the right
List group item heading
Image to the right
Single with icons and tags
Use the .list-group-item
class with any icon or text.
Three line list
Use the .list-group-item
class with any a, button or li
element inside a .list-group
element.
Linked list group item heading
This allows more than two lines. Hopefully an ellipsis ends this text.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ut malesuada elit. Proin tristique, lorem eu vehicula congue, lectus ipsum porta quam, eget rutrum sapien turpis et libero.
Text list group item heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque ut malesuada elit. Proin tristique, lorem eu vehicula congue, lectus ipsum porta quam, eget rutrum sapien turpis et libero.