I would like to show my both Tribute page and Survey form. I solved both challenges using flex box and tried to make it responsive.
I faced a problem in specifying height for a flex-item. For example, In tribute page, I initiated the
<main> tag’s (Flex-container, and items were directed as columns) height as 100vh and later I initiated
<footer> tag’s (last flex-item in the container) height as 20vh. What I expected was it would appear in the page-end as the other footers but it appeared above on another flex-item.
My doubt is :- what are the situations we must specify the height for flex-items? or can we avoid it?(let it automatically decide its height,
height: auto;). Can you guys please explain me where we should define the height and width for flex-items and containers?.
Please tell me what you guys think. Should I change anything for better user experience or responsiveness, any other advises to improve my code?. I really appreciate any feedback for further improvement.