Order summary component / Flexbox

Just started diving into using flexbox for responsive web design. Below are some of the obstacles I faced when developing this project.

1. The flexbox shrinks horizontally when I minimize the browser window vertically. Can anyone explain why this happens.
2. I struggled while adjusting padding and don't know which units(eg:rem,em,vh,vw) are best to use to build responsive layout. I found a quick fix 'a one line code' that suits all screen sizes. You can check out my 'readme' file for the solution.
3. Any suggestions you wish to share will be very much appreciated. Thank you for your time. Hare Krishna :)