Bulma Button Addons

Bulma is an open-source CSS framework that provides pre-built components which can be combined together to make responsive websites and web applications. To use buttons as add-ons, we have to add a has-addons class on the field container. This will attach the buttons together.

Bulma Button addons Class:

• has-addons: If this class is added on a field container, the controls inside the container will attach together

Syntax:

<div class="field has-addons">
 <p class="control">
 <button class="button">
 ...
 </button>
 </p>
</div>

Example: In the example below, we used three buttons inside a field container and added a has-addons modifier to the field container.

Output:

👁 Bulma Button Addons

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