When you need to create a collection of similar action buttons, use a button group.

Angular Components

ClrButtonGroup

ClrButton group is a component made up of multiple ClrButton elements. Button elements can optionally be designated for an overflow menu.

Selector & Basic Usage

<clr-button-group></clr-button-group>

Bindings

Binding	Type	Options	Default	Description
[clrMenuPosition]	input	top-right, top-left, bottom-right, bottom-left, right-top, right-bottom, left-top, left-bottom	bottom-left	Set the position of the overflow menu when it is open.

ClrButton

Angular button component used only with ClrButtonGroup.

Selector & Basic Usage

<clr-button></clr-button>

Bindings

Binding	Type	Options	Default	Description
[clrInMenu]	input		false	Designate a button for display in the overflow menu.
[class]	input	'class1 class2	none	A string of space delimited names that is used on the button element.
[name]	input	btnName	none	Assign the button element a name
[type]	input	e.g 'submit'	none	Set the type of button for screen readers.
[id]	input	n/a	none	Set the id for the button element.
[disabled]	input	n/a	false	Set the disabled attribute for the button element.
(click)	output	n/a	none	Listen for the user generated click events..

CSS

Button group buttons have all of the same classes, states, types and sizes that stand alone Buttons do.