"Vertical stack flex box not pushing elements"

Issues
1

I am trying a vertical stack (which is a flex box direction column) trying to have the middle one as grow but it is not pushing away the others… the main container is the page.

2

This is a bit hard to help without some more contextual details. I think you’ll need to tell us more about the container properties and item properties.

3

The thing is, in the end, it is a main div that represents a page no?.. I solved my problem by making a vertical stack, placed three stacks within (first and last are horizontal stacks to represent the header and the footer of the page) and I gave the following CSS just to resolve my problem… I want to make sure that header and footer are at the top and bottom of the window if there is no scroll

.pageContainer {
min-height: 100vh;
}

.pageContainer > *:nth-child(2){
flex-grow: 1;
}