使用 Bulma.io 在容器末尾开始列

Question

我想知道是否有一种好的方法可以在其容器的末尾开始 Bulma.io 的列。通常的设置是：

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

将列均匀分布在整个容器中。

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

我知道可以让它们更短并左对齐 is-(size) 类。我想做同样的事情，但是右对齐，所以会发生以下情况：

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

我已经查阅了文档，但找不到任何内置方式。

Answer 1

恐怕 .columns 没有内置方法。由于某些原因，.is-right class 仅适用于 .tags、.buttons 等。您可以做的是创建和使用您自己的 utility/helper class:

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

使用 Bulma.io 在容器末尾开始列

Start columns at end of container with Bulma.io

css

bulma