我试图让三个 v-btn 在宽屏中水平显示,在移动设备中垂直显示。
以下代码可以完成这项工作,但是 v-col 的大小太宽了,所以按钮之间的距离太远了。
如何确保 v-col 只占用其中的内容空间?
<v-container
class="ma-0 pa-0"
fluid
>
<v-card
max-width="100%"
tile
flat
max-height="500px"
>
<v-parallax
:src="require('../photo.jpeg')"
fluid
>
<v-row
align="center"
justify="center"
align-content="center"
class="no-gutters ma-2"
>
<v-col
class="text-center no-gutters"
cols="12"
sm="4"
>
<v-btn>Hello</v-btn>
</v-col>
<v-col
class="text-center no-gutters"
cols="12"
sm="4"
>
<v-btn>Hello</v-btn>
</v-col>
<v-col
class="text-center no-gutters"
cols="12"
sm="4"
>
<v-btn>Hello</v-btn>
</v-col>
</v-row>
</v-parallax>
</v-card>
</v-container>