Bulma Button group

When we need to group the button on a single line we usean is-grouped modifier in the field container. To group the buttons on a single line we will all the buttons in a div and will give the class is-grouped in the field container.

Bulma Button group class:

• is-grouped: In Bulma is-grouped class is used to group all the buttons on a single line.

Syntax: 

<div class="field is-grouped">
 <p class="control">
 <button class="button">
 ...
 </button>
 </p>
</div>

Example 1: In the example below, we used an is-grouped modifier to the div tag.

Output:

👁 Bulma Button group

Example 2: In the example below, we used an is-grouped modifier to the div tag.

Output:

👁 Bulma Button group

Reference Link: https://bulma.io/documentation/elements/button/#button-group