Single price grid component

Please log in to post a comment
Log in with GitHubCommunity feedback
- @bccpadge
Hello @SecretariatV. Congratulations on completing this challenge!!!🎉
I have few tips you might be interested in to improve your solution.
HTML 📃:
- To make your website your accessible you can use HTML Semantic Elements
Example:
<body> <main></main> <footer></footer> </body>
CSS 🎨:
- Font size shouldn't be pixels because pixels are absolute unit and doesn't scale when users want to change their font size in their web browser setting.
More info📚:
The code snippet below is updated to remove the
width: 100vw
andheight: 100vh
which are unnecessary CSS properties. The reason why you need to removeheight:100h
because on mobile devices component get cuts off. Addingpadding: 4rem 0
give space on the top and bottom the component.#root { display: flex; align-items: center; justify-content: center; /*width: 100vw; */ /* height: 100vh; */ background-color: #e5eff5; padding: 4rem 0; }
Hope you find this useful and don't hesitate to reach out to me if you have any questions
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