I am attempting to have the first section of my page be 100% of the user's window, while having 3 vertical items resize depending on the height of the screen.
To achieve this I am using flexbox, specifically these styles:
It looks like you're mixing two rules that don't work well together.
You've given the container
But you've also given each flex item
If each item is set to consume all available space,
justify-content: space-between does nothing (there's no space to distribute).
Pick one or the other.