I see you are already sorted with the good solution from @andris.vilde but I thought I would explain the solution I gave in my post and what the difference is
If you removed the justify-content and then set margin-top auto on the buttons the buttons would be pushed to the bottom and the content above would reside in the normal flow.
flex: 1 0 100%;
/*height: 100%;not needed*/
When you use an auto margin on a flex-item the side that is auto will soak up all the available space and will push the element as far in one direction as it can (be that horizontal or vertical). In your case this would push the button to the bottom of the flex-container automatically without interfering with the content above.
justify-content: space-between; solution on the other hand spreads out all the content which means top and bottom are aligned at top and bottom but any elements between top and bottom are spread out evenly. This means you get different gaps between the elements if there is different content in each box (essentially the inner content is spread out over the available space).
Both methods are correct and useful but my preference would be not to spread the middle items but that’s just a personal preference and if you like the spread out effect then all well and good. It does depend on content to some degree but I thought I’d just explain that my solution did work even if you prefer the other solution