Scrolling in Q-Page-Container instead

[raynorise]

Hi everyone,

I am currently working on a website using quasar framework and have been trying to figure out how can I make the scrollable area within the Q-Page-Container instead of scrolling the entire page

https://jsfiddle.net/tr52yg39/21/

From this jsfiddle, you could see if I were to scroll down, the top left border radius will be gone and that is not what I wanted.

I was hoping to scroll within the container instead so that the top left border radius would remain in that position

[beets]

@raynorls Try this:

    <q-page-container class="bg-blue absolute-full">
      <div class="fit scroll">
        <router-view />
      </div>
    </q-page-container>

[beets]

You could also replace that div with a q-scroll-area. Keep the fit class but the scroll class wouldn’t be needed anymore. Just depends if you want the fancy scrollbar and other features q-scroll-area provides.

[raynorise]

@beets Thank you! This works perfectly. I did tried adding a <div class=“fit scroll”> previously, but now I know the problem lies on “absolute-full” in the q-page-container. Much thanks!