SINGLE-PRICE-GRID-COMPONENT USING HTML AND CSS

Solution retrospective
Any suggestions on improving the website would be helpful.
Please log in to post a comment
Log in with GitHubCommunity feedback
- @EmmanuelHexer
Nicely done.
-
One tip i can give you is that a web developer should always take measurements into consideration.
-
You can open the design with paint 3d and them crop onto the areas where u are designing. It will show you the size in px on the side.
Marked as helpful -
- P@dwhenson
Hey @Sumit640 lovely job here!!
Here's some quick feedback that might help you in the future:
- Centring content: when you have a single component like this and want to centre it on a page, I would suggest adding
dispaly:grid
to the body along withplace-items:center
. This combined with amin-height:100%
also on the body should ensure the component remains in the centre of the page - this is handy for quite a few single component challenges like this. - One thing that's worth considering is whether your "button" element is actually a
button
or alink
. The most important thing is what the element will do not what it looks like. This page has a great summary and lots of useful links on this: https://css-tricks.com/buttons-vs-links/ In this case I would probably say it's a link?
Hope this helps and good luck with the next challenge!!
Cheers 👋
Dave
Marked as helpful - Centring content: when you have a single component like this and want to centre it on a page, I would suggest adding
- Account deleted
Hello there! 👋
Congratulations on finishing your challenge! 🎉
I have some feedback on this solution:
- Always Use Semantic HTML instead of
div
like<main>
<header>
, etc for more info
if my solution has helped you do not forget to mark this as helpful!
Marked as helpful - Always Use Semantic HTML instead of
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