I have a page which is supposed to be non-interactive. It's just a screen you can show during a teams meeting, and then you don't touch it after than.

Basically I have a parent container, which just has width: 100vw and height: 100vh. So it just takes up the entire browser window. Then stuff/children is added to this parent. Each child takes up some space, but at some point, there might be too many children, and they begin to expand the parent div - i.e. making the parent not fit the screen anymore. If this was an interactive page, I could just add overflow-y: auto, and I would be able to scroll inside the container. But again, I am not going to touch this screen.

Therefore I was looking for some kind of solution, so that when the parent had no more space, the children just scaled (or something similar), so they could fit. I know, at some point, if there were a million children, each children would be so tiny. But that doesn't really matter :)

So yeah, are there any way to do this, or do I have to think about something else ?