<v-btn>
を<v-flex>
にセンタリングしようとしています。 <v-flex>
はflexbox divであるため、次のように変換されるjustify-center
を使用します
justify-content: center
私の方向は水平なので、ボタンは中央に揃えられますが、そうではありません。ここに私の問題を再現するコードペンがあります。
https://codepen.io/anon/pen/ZXLzex
Div(v-flex)の中央にボタンを登録したいです。
完全なコードは次のとおりです。
<v-card>
<v-card-text >
<v-text-field label="Email"></v-text-field>
<v-text-field label="Password"></v-text-field>
</v-card-text>
<v-card-actions>
<v-layout row>
<v-flex justify-center>
<v-btn primary>
Signup
</v-btn>
</v-flex>
</v-layout>
</v-card-actions>
</v-card>
<div class="text-xs-center">
内にボタンをラップします
<div class="text-xs-center">
<v-btn primary>
Signup
</v-btn>
</div>
Devは彼の例で使用しています。
v-card-actions
の中央揃えボタンの場合、class="justify-center"
を追加できます。
<v-card-actions class="justify-center">
<v-btn>
Signup
</v-btn>
</v-card-actions>
センタリングに関するその他の例については、 here を参照してください
<v-layout justify-center>
<v-card-actions>
<v-btn primary>
<span>SignUp</span>
</v-btn>`enter code here`
</v-card-actions>
</v-layout>