如何使用Bulma创建两行

Question

我正在使用Bulma，而且对Bulma还不熟悉。

我试图创建两行内容，但是它们呈现为并排的，而不是像预期的那样上下排列。

我该如何使用Bulma创建两行？

我试图使用class="row"。

这是我的代码：

  <div class="row">
    <h1 class="title is-size-1">
        About
    </h1>
  </div>

  <div class="row">
    <span class="subtitle is-size-4">
      long text.
    </span>
  </div>


</div>

回答：我使用的是 <article class="tile is-child notification is-white"> 标签。

- Ângelo Rigo

Answer 1

尝试这个，也许可以解决你的问题。在这里，flex-direction: column而不是flex-direction: row。is-full像块元素一样工作，它始终会取width:100%。

   <div class='rows'>
      <div class='row is-full'> Rows </div>
      <div class='row is-full'> Row one </div>
    </div>

你可以采用这种方法进行修复，但我不确定这是否是你想要的。

.rows{
    display: flex;
    flex-direction: column;
}

- codeuix