I'm a beginner with Vue and Vuetify, seeking help on aligning buttons properly. I have a container with v-text-fields and v-combobox centered in the middle.
Now I want to add three buttons below this form, but they are not aligned vertically. Each button appears lower than the others. How can I adjust this so they all align nicely at the top?
https://i.sstatic.net/yZxQb.png
<template>
<div class="ladder">
<v-container fluid>
<v-row justify="center">
<v-col cols="12" sm="6">
<v-text-field
v-model="higher_price"
:rules="[rules.required, rules.number]"
label="Higher Price"
></v-text-field>
<v-text-field
v-model="lower_price"
:rules="[rules.required, rules.number]"
label="Lower Price"
></v-text-field>
</v-col>
</v-row>
<v-row align="start">
<v-spacer></v-spacer>
<v-col align="center" xs="4" >
<v-btn color="primary"></v-btn>
</v-col>
<v-col>
<v-col align="center" xs="4" >
<v-btn color="primary"></v-btn>
</v-col>
</v-col>
<v-col>
<v-col align="center" xs="4" >
<v-btn color="primary"></v-btn>
</v-col>
</v-col>
<v-spacer></v-spacer>
</v-row>
</v-container>
</div>
</template><script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>