在Vuetify中的两个图标之间留出空间

Question

我有两个图标，如何在它们之间留出空格？

App.vue中的两个图标：

<v-btn icon class="grey lighten-4">
        <v-icon>mdi-magnify</v-icon>
      </v-btn>
      
      <v-btn icon class="grey lighten-4">
        <v-icon>mdi-dots-vertical</v-icon>
      </v-btn>

Answer 1

建议使用mx-2之类的内置类名在通过div包裹按钮之后在按钮周围添加一些边距：

<div >
     <v-btn icon class="grey lighten-4 mx-2">
        <v-icon>mdi-magnify</v-icon>
      </v-btn>
      
      <v-btn icon class="grey lighten-4 mx-2">
        <v-icon>mdi-dots-vertical</v-icon>
      </v-btn>
</div>

LIVE DEMO