i am trying to create a Vuetify footer and i am running into some issues. I have made a Codepen here https://codepen.io/anon/pen/mYazWv.

I am new to vuetify so i'm trying to see how i can put the title in the center and push the checkbox to the right along with the buttons with using too many spacers

I am following the official vuetify docs https://vuetifyjs.com/en/components/footer

  color="primary lighten-1"
  <v-card class="flex flat tile"> 
    <v-card-title class="primary lighten-1">
      <v-layout justify-center row wrap>

        <strong class="subheading white--text">
        Some Random Text


 <v-checkbox dark label="Click Me"></v-checkbox>
        <v-btn v-on:click="saveClicked">
        <v-icon>save</v-icon> Save
          <v-icon>close</v-icon> Cancel

The v-spacer pushes the buttons in place but doesn't seem to apply on checkbox. Any help will be appreciated.

1 Answers

Rnubi On
  1. Add grow class to <v-layout>.
  2. Add shrink class to <v-checkbox>.

Updated pen.

Note: to align the title to left, remove flex and justify-center classes from <v-layout>.