Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive QR-Code Component

@gbabohernest

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hi👋 kindly check out my solution and give me your feedbacks. I kinda need them 👍👌

Community feedback

@codewithpedro

Posted

Hi Ernest,

You did a good job overall. The design is well done and the html is good.

The CSS can be modified a bit. You don't need many media queries to accomplish a size change. You actually would only need one for this project. You can have a mobile design first (no media query just the css) and add the media query for tablet/desktop (either a minimum width of 600px or 900px). Lastly, don't use a percentage width for your card component size, instead use a fixed size width and increase the size in the media query if you want.

Here is a good article about media query. Good Luck!

https://www.freecodecamp.org/news/the-100-correct-way-to-do-css-breakpoints-88d6a5ba1862/

Marked as helpful

0

@gbabohernest

Posted

@jovanydev Thanks. this is helpful 👍

0

Please log in to post a comment

Log in with GitHub
Discord logo

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