CODEWITHSUNDEEP
cssbulma
supersize
supersize

Reputation: 14783

Start columns at end of container with Bulma.io

I would like to know if there is a good way to start the columns of Bulma.io at the end of its container. The usual setup is:

<div class="container">
  <div class="columns">
    <div class="column">
      First
    </div>
    <div class="column">
      Second
    </div>
    <div class="column">
      Third
    </div>
  </div>
</div>

which spreads the columns evenly throughout the container.

-----------------------------------------------------
|               | |                | |              |
|               | |                | |              |
-----------------------------------------------------

I know it is possible to make them shorter and left-aligned with is-(size) classes. I would like to to the same but make the right-aligned so the following happens:

-----------------------------------------------------
|                      | |       | |       | |      |
|                      | |       | |       | |      |
-----------------------------------------------------

I have looked up the documentation but I couldn't find any built in way.

Upvotes: 0

Views: 770

Answers (1)

n1stre
n1stre

Reputation: 6086

I'm afraid there's no built in way for .columns. For some reason .is-right class is only available for .tags, .buttons and some more. What you could do is to create and use your own utility/helper class:

.columns.is-right {
  justify-content: flex-end;
}

Upvotes: 1

Related Questions