Vuetify的fab按钮图标未垂直居中

Question

我无法让vuetify的fab按钮垂直居中。

这是我的用法，与众不同。

<v-btn 
    color="primary" 
    fab 
    small >
    <v-icon>print</v-icon>                  
</v-btn>

这是我的main.js文件

import Vue from "vue";
import Vuetify from "vuetify";
import "vuetify/dist/vuetify.min.css";
import "material-design-icons/iconfont/material-icons.css";
import "typeface-roboto/index.css";
Vue.use(Vuetify);
new Vue({
  router,
  store,
  render: h => h(App)
}).$mount("#app");

这是输出

我正在使用Vue 2.5.16和Vuetify 1.1.3版本

即我还没有添加样式或任何其他外部CSS

---

更新：  我通过在height:auto上添加v-icon

找到了解决方法

<v-icon style="height:auto;">print</v-icon>

但这仍然不是解决方案。

Answer 1

在我的情况下，这是因为CSS导入的顺序

FAB icon not centered vertically

Add information about load Google font before Vuetify css

import "material-design-icons-iconfont/dist/material-design-icons.css";
import "vuetify/dist/vuetify.min.css";