Question

我想将我的内容水平放在Bulma列中。

以下是一个例子：

我想将'class="column is-2"'放在＆{39; columns＆＃39;格。

以下是我的代码开始的方式：

<div class="columns is-vcentered">
    <div class="column is-three-fifths is-offset-one-fifth has-text-centered">
        <div class="columns is-desktop is-vcentered">
            <div class="column is-2">
                    <button mat-raised-button color="primary" (click)="initTimer()">
                        <mat-icon>play_arrow</mat-icon>
                        Start Timer
                    </button>
            </div>

我想把里面的按钮置于-2的中心位置。

任何帮助将不胜感激。谢谢！

Answer 1

如果要将容器及其容器中的按钮居中对齐可用空间，请执行以下操作：

<div class="columns is-centered">
  <div class="column has-text-centered is-2">
    <a class="button">Button 1</a>
  </div>
  <div class="column has-text-centered is-2">
    <a class="button">Button 2</a>
  </div>
  <div class="column has-text-centered is-2">
    <a class="button">Button 3</a>
  </div>
  <div class="column has-text-centered is-2">
    <a class="button">Button 4</a>
  </div>
</div>

JS Fiddle example

希望这就是你的意思。

在Bulma Framework的Columns中水平居中对齐项目

1 个答案: