'Stop FlatList from overflowing containing View?

How do you make a FlatList stop expanding beyond its enclosing view and become scrollable while still taking all (legal) space in the enclosing view?

So far setting height to a specific number worked, but setting height to "100%" still overflows, setting flex:1 still overflows.

Screenshot

This is React Native Web.

Solution 1:^[1]

For flexbox to work correctly flex:1 must be maintained for every enclosing view up the hierarchy. One of my views didn't have flex:1.

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Solution	Source
Solution 1	Ryan Tremblay