Css 类星体框架类

Css 类星体框架类,css,flexbox,vuejs2,quasar-framework,Css,Flexbox,Vuejs2,Quasar Framework,使用Quasar Framework 0.15,我看不到对使用Flex相关类有任何影响。一个简单的组件: <template> <q-page class="flex"> <div class="row"> <div class="col-sm-6 justify-center"> <q-btn-group> <q-btn label="1" />

使用Quasar Framework 0.15,我看不到对使用Flex相关类有任何影响。一个简单的组件:

<template>
  <q-page class="flex">
    <div class="row">
      <div class="col-sm-6 justify-center">
        <q-btn-group>
          <q-btn label="1" />
          <q-btn label="2" />
          <q-btn label="3" />
        </q-btn-group>
      </div>
    </div>

  </q-page>
</template>

当我检查组件时,例如,类为“row”的div没有预期的全宽,任何其他与Flex相关的类,如“justify start”或“col-sm-6”似乎都不起作用

在本例中,我的btn组显示在屏幕的左上角,好像没有应用css(“justify-center”应该居中)


我正在一个全新的安装中运行web/material主题。

您可以使用简单的q-page,无需任何类,它将占据全部宽度。也可以使用固定中心类对内容进行居中

<template>
  <q-page>
    <div class="row">
      <div class="col-sm-6 fixed-center">
        <q-btn-group>
          <q-btn label="1" />
          <q-btn label="2" />
          <q-btn label="3" />
        </q-btn-group>
      </div>
    </div>

  </q-page>
</template>