Make entire page scroll when v-navigation-drawer exceeds viewport height

20 views Asked by At

My Vuetify 2 app consists of a v-navigation-drawer and a v-main component. Whenever the content in v-navigation-drawer exceeds the viewport height, a vertical scrollbar appears within the component. Instead of having a local scrollbar, I would prefer the entire page to scroll when the content in the v-navigation-drawer area exceeds the viewport height.

Here's what my application looks like:

<v-app>

    <v-navigation-drawer permanent app>
        <!-- NAVIGATION DRAWER CONTENT -->
    </v-navigation-drawer>

    <v-app-bar app>
        <!-- APP BAR CONTENT -->
    </v-app-bar>

    <v-main>
        <v-container fluid>
            <!-- MAIN CONTENT -->
        </v-container>
    </v-main>

</v-app>

I have played around with the overflow property of v-navigation-drawer but was unable to achieve the desired outcome.

0

There are 0 answers