Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted about 3 years ago

Product-preview-re-do

accessibility, foundation
Lindelwe Khumalo•170
@iSoyecodes
A solution to the Product preview card component challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


Previously, I did this challenge and made a lot of errors, which you can see on my github repository. Because my website wasn't responsive and I'd locked the height, the page collapsed and wrapped to the next row. I utilized Grid CSS and Flexbox combined to solve this challenge, created this site mobile-first, and included media queries for large displays. I utilized the appropriate CSS units and lowered the font size; I'll provide the link below to guide you through CSS units. I hope my solution will be helpful to you. If I made a mistake, kindly remark. I've come here to study.

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on Lindelwe Khumalo's solution.

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

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner
  • Use cases

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License