Vuetifyで謎の15pxのスペースが空いてしまうあなたへ

2020年9月27日

Nuxt.js+Vuetifyでどう考えてもスクロールバーな15pxの枠があってとれなかった。結果としてはVuetifyのせいであったんだけど、Nuxt.jsなどの絡みで何が原因かわからなかった。

結果としては、Vuetifyのoverflow-yの設定だった。

html {
  overflow-y: scroll;
}

なので、overflow-yを上書きしてやればよい。

html { 
  overflow-y: visible;
}
/* dark themeの場合は色をかえてやるとよい */
::-webkit-scrollbar {
  background: #131313;
}

こういう地味なのって気づけない。