為什么我的兩個 div 不在移動視圖中居中？我正在使用 Vuetify CSS flex helper justify-center 來實作它，但它不起作用。使用 justify-sm-center 它也不起作用。我哪里錯了？
<v-col cols="12">
<v-card elevation="3" class="d-flex flex-column flex-sm-row justify-center pt-2 pb-2">
<div class="pt-2 pl-4">
<span class="textoDos--text"><strong>?No estás registrado?</strong></span>
</div>
<div>
<v-btn
plain
class="textoDos--text"
to="/registro"
>
<strong>Crear una cuenta</strong>
</v-btn>
</div>
</v-card>
</v-col>
注意： flex-direction 是可以的。我需要它是桌面/平板電腦中的行和移動設備中的列。你可以在這個codepen 中檢查它。
uj5u.com熱心網友回復：
這是因為您column在小型設備上使用 flex 方向。使用列方向時，兩者justify-center的作業方式都不同。align-center
居中對齊
- 水平輸入
row direction和垂直打開column direction。
居中對齊
- 垂直輸入
row direction和水平輸入column direction。
結論
只需添加align-center到 v-card 元素就可以了。
<v-card elevation="3" class="d-flex flex-column flex-sm-row justify-center align-center pt-2 pb-2">
uj5u.com熱心網友回復：
您可以使用幫助程式類解決此問題align-center：
<v-card elevation="3"
class="d-flex flex-column flex-sm-row justify-center pt-2 pb-2 align-center">
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/421158.html
標籤：
上一篇：無法通過道具改變BG顏色