Bulma CSSで画像とテキストを横並びにする方法

あんまりBulma使ってる人見ないよね。。。

環境

• Bulma CSS 0.75

完成イメージ

ちょうどこんな感じ

コード

上のサンプル見れば終了なんだが一応説明

<div class="columns is-vcentered">
  <div class="column has-text-centered">
    <figure class="image is-128x128 is-inline-block">
      <img src="https://bulma.io/images/placeholders/128x128.png">
    </figure>
  </div>
  <div class="column">
    <h1 class="title">
      タイトル
    </h1>
    <h2 class="subtitle">
      サブタイトル
    </h2>
  </div>
</div>

.columnsでカラムコンテナを作り、その中で画像と文字をそれぞれカラムとして入れている。

. is-vcenteredをつけることで文字列が画像の高さの中心に来るようになる。