The issue is that the child element, with its height set to 100%, won’t fill the available free space within its parent. These images show it clearly:
image 1
image 2

I tried setting the height to a lower value, like 50%, with overflow hidden, but it had no effect, just like any other percentage value. It’s as if it doesn’t know what to base the percentage calculations on.
I believe it’s something simple, but I can’t figure it out. Also, I would like to note that the app is written in Angular, although I don’t think that matters in this case.