Vue.js - Vuetify HTML Tag CSS overflow-y:scroll Issue

 

 

 

 

 

 

평소에 Vue.js로 개발을 하면서 ElementUI를 주로 사용했었지만, 이번에는 Vuetify를 사용해보고 싶어서

Vuetify Third Party Libaray를 사용하는 도중 정말 황당한 경험을 겪었다.

 

(모듈 추가 후 바로 우측에 원치 않은 스크롤이 생김;;)

 

 

전혀 원하지도 않는 페이지에 알 수 없는 스크롤이 생겨버려서 도저히 어느쪽에서 해결을 해야할 지 모르는 상황에 알고보니

HTML Style에 'overflow-y: scroll'이 적용되어 있었다.

 

(기존에 없었던 HTML Tag CSS에 'overflow-y:scroll'이 생김)

 

 

이 문제는 예전부터 있었던 Vuetify의 대한 이슈라고 한다.

이 이슈를 해결하기 위해서는 HTML Tag에 강제적으로 'overflow-y: auto !important'를 추가해 줘서 스크롤을 간단하게 없앨 수 있다.