Bulma: Not able to right align the button addons.

[coderabsolute]

This is about Bulma.

Overview of the problem

Not able to right align the button field has-addons div.

I'm using Bulma 0.7.1
My browser is Chrome.

Description

<div class="columns">
  <div class="column has-text-right">
    <div class="field has-addons">
      <p class="control">
        <a class="button">All</a>
      </p>
      <p class="control">
        <a class="button">Reserved</a>
      </p>
      <p class="control">
        <a class="button">Rented</a>
      </p>
      <p class="control">
        <a class="button is-selected is-primary">Overdue</a>
      </p>
    </div>
  </div>
</div>

Expected behavior

The buttons addons should be moved towards the end of right.

Actual behavior

The buttons addons is still left aligned.

[jgthms]

The “has-text-right” works for textual content, not flexbox items, which the “control” elements are.

[coderabsolute]

@jgthms How do I get my control to be right aligned, then? :)

[jgthms]

You can use buttons is-right:

<nav class="buttons is-right">
  <a class="button">One</a>
  <a class="button">Two</a>
  <a class="button">Three</a>
</nav>