Vuetify.js: how to place button actions in v-card on left and right?

Your code is correct. Just use this:

      <v-card-actions>
        <v-btn>Share</v-btn>
        <v-spacer></v-spacer>
        <v-btn>Explore</v-btn>
      </v-card-actions>

So just change the v-spacer to not be self-enclosing tag.


Just wrap them in v-flex and add text-xs-right class to the second, to pull to the right the second button.

<v-card-actions>
    <v-flex>
      <v-btn>Share</v-btn>
    </v-flex>
    <v-flex class="text-xs-right">
      <v-btn>Explore</v-btn>
    </v-flex>
</v-card-actions>

CodePen


Edit Vuetify 2.1.0 (thanks to @J. Unkrass) :

Just wrap them in v-col and add text-right class to the second, to pull to the right the second button.

<v-card-actions>
    <v-col>
      <v-btn>Share</v-btn>
    </v-col>
    <v-col class="text-right">
      <v-btn>Explore</v-btn>
    </v-col>
</v-card-actions>