Order Summary Card using flexbox, and a pinch of Bootstrap 4.5

Solution retrospective
🙉💰give feedbacks on my solution and earn guaranteed 5 to 30 points and rank higher up in frontendmentor's world🙉💰
one thing i learned using flexbox is that it isn't reliable. i thought i understood them but it's complicated.
to the people who have solved this challenge just using flexbox, open your browser's developer tools , dock it at the bottom and increase the dev-tools size vertically up and you'll see you lose your top content.
i couldn't understand why this is happening ????
Please log in to post a comment
Log in with GitHubCommunity feedback
- @emestabillo
Hi @ratan17, line 4 on your CSS
html, body{height:100%;}
is causing it. I would remove it and applymin-height: 100vh
to body instead. This allows the user to scroll vertically if their screen is smaller than the page content.Marked as helpful - @tomas938
Hi, your solution looks good maybe you can add
outline:none
to button i think it looks better without outline ;)
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord