Tronic247 Material

Button group

Edit this page

Usage

Create a div or any element with the class button-group. Add then add buttons inside that element.

<div class="button-group">
    <button>Button</button>
    <button>Button</button>
    <button>Button</button>
</div>

Outlined button group

Create add the class outlined to the element with the class button-group and to the buttons.

<div class="button-group outlined">
    <button class="outlined">Button</button>
    <button class="outlined">Button</button>
    <button class="outlined">Button</button>
</div>

Text button group

<div class="button-group">
    <button class="text">Button</button>
    <button class="text">Button</button>
    <button class="text">Button</button>
</div>

Unelevated button group

<div class="button-group">
    <button class="unelevated">Button</button>
    <button class="unelevated">Button</button>
    <button class="unelevated">Button</button>
</div>