Buefy框架-移动不堆叠的列

时间:2019-02-10 19:27:41

标签: vue.js responsive-design buefy

我将Buefy框架与Vue结合使用来构建应用程序。列响应不适合我。 Bulma文档指出:“ 默认情况下,列仅从平板电脑开始激活。这意味着列在移动设备上彼此堆叠。 ”网站-当我在移动视口中查看“列”文档时-列确实会堆叠。

在我的Vue组件中-我正在使用pug作为标记语言。这是应该在移动设备上堆叠的简单布局:

<template lang="pug">
    .container
        .columns
            .column 
                p first column
            .column
                p second column
</template>

使用chrome开发人员工具-看起来就是这样。
enter image description here

我认为第二栏应该堆叠在第一栏下...为什么不呢?从帕格渲染的html看起来不错:

<div class="container">
     <div class="columns">
          <div class="column">
              <p>first column</p>
          </div>
          <div class="column">
              <p>second column</p>
          </div>
     </div>
</div>

0 个答案:

没有答案