HTML CSS

Solution retrospective
Hey everyone, I am open to any feedback. Please let me know where I can improve on my solution.
Please log in to post a comment
Log in with GitHubCommunity feedback
- @AgataLiberska
Hi @tesla-ambassador, it looks great! I noticed two things: not sure whether
<article>
is the best choice for the sections of your card. All three parts form one whole component, and an<article>
is something that makes sense on its own and can be distributed independently. I would probably just use divs here, but there may be a better option. The second thing is a tiny detail and I don't know this design, so sorry if that's what it was supposed to look like - but all text is centered in column layout, except for the price - was that intentional?Hope this helps :)
- @ApplePieGiraffe
Hey, TeslaAmbassador! 👋
Sorry, it took me a while to give you feedback for this challenge. 🙃 But good job on this one, of course! 👏
I think it would be better if you gave the card component a fixed width (rather than a width dependant upon the width of the viewport) and then simply changed the width using a media query when the width of the screen becomes very small. This will make the dimensions and design of the card component more consistent across screen sizes and make it easier to work with.
And rather than add
margin-top: 10%
to thebody
, addmin-height: 100vh
. That'll ensure that thebody
is always at least as high as the viewport itself and eliminate the need to addmargin-top: 10%
to create some space between the top of the page and the card component. 😉Keep coding (and happy coding, too)! 😁
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