Chartjs-How to prevent squashing flexbox absolute pane by ChartJs?

by

0👍

✅

So I started from the initial problem — how to take remaining space and enable scroll there? For two panes there is nice solution with the flex layout: https://stackoverflow.com/a/68516470/210342 but as in my case, when I have nested panes, I couldn’t make flex take entire window and only window space (without using this hack with absolute position).

Since I don’t know CSS I tried grid approach and it worked right on spot. I simply added "height:100vh" for entire grid container and for given scrollable pane "overflow:auto" and that’s it.

Now I have scrolling and well sized chart.

Nice grid generator I used: https://cssgrid-generator.netlify.app/

Leave a comment