如何在Bootstrap-vue中强制设置卡宽度？

问题描述

如何设置卡片的特定宽度并使之响应。现在，此代码甚至在较小的设备上也可以水平放置我的所有物品，从而缩小卡的宽度。但是当我选择垂直显示项目时，宽度样式有效。如何设置特定宽度以使其响应并向下移动到另一行？

        <b-card
          v-for="project in projects"
          :key="project.id"
          :title="project.name"
          :img-src="project.image"
          tag="article"
          img-top
          class="font-1"
          style="width: 25rem"
        >
          <b-card-text>
            {{ project.description }}
          </b-card-text>

          <b-button size="sm" :href="project.live" variant="primary"
            >live</b-button
          >
          <b-button size="sm" :href="project.code" variant="primary"
            >code</b-button
          >
        </b-card>
      </b-card-group>

解决方法

谢谢我已经解决了。事实证明，b-card-group默认样式没有响应。将其替换为div行以设置多个项目的卡片宽度样式

bootstrap-vue html