Use list-group class in an unordered list and list-group-item class to create a default list group.

Use active class to list-group-item to indicate the current active selection.

Use disabled class to list-group-item to make it appear disabled.

• 

  James Ballard
• 

  Nancy Martino
• 

  Henry Baird
• 

  Erica Kernan

Use <a> tag to create actionable list group items with hover, disabled, and active states by adding list-group-item-action.

Use <button> tag to create actionable list group items with hover, disabled, and active states by adding list-group-item-action.

Use list-group-flush class to remove some borders and rounded corners to render list group items.

• Send the billing agreement
• Send over all the documentation.
• Meeting with daron to review the intake form
• Check uikings theme and give customer support
• Start making a presentation

Use badges to any list group item to show unread counts, activity, and more with the help of some utilities.

• Send the billing agreement High
• Send over all the documentation
• Meeting with daron to review the intake form Low
• Check uikings theme and give customer support Medium
• Start making a presentation High

Use Bootstrap’s checkboxes within list group items and customize as needed.

Use Bootstrap’s radios within list group items and customize as needed.

Use icons to any list group item to show icons to list group items.

• Send the billing agreement
• Send over all the documentation.
• Meeting with daron to review the intake form
• Check uikings theme and give customer support
• Start making a presentation

Use list-group-numbered class (optionally use an <ol> element) to show numbered list group items.

1. Send the billing agreement
2. Send over all the documentation.
3. Meeting with daron to review the intake form
4. Check uikings theme and give customer support
5. Start making a presentation

Add nearly any HTML within, even for linked list groups like the one below, with the help of flexbox utilities.