Flex sizing is governed by flex-grow (share of free space to occupy), flex-shrink (ability to shrink), and flex-basis (starting size), combined in the flex shorthand. flex: 1 makes items share the space equally.
Example
main { flex: 1; } /* takes the remaining space */