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

Emrah Isovicโ€ข 60

@EmrahIso

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


Up to which minimal browser width do we do responsive?

Community feedback

Daniel ๐Ÿ›ธโ€ข 44,230

@danielmrz-dev

Posted

Hello @EmrahIso!

Your project looks great!

The projects here usually have a 375px version and a 1440px one.

In this case, since mobile and desktop versions are pretty much the same, you don't need to worry about responsiveness. You're gonna have the opportunity to practice responsiveness on the next projects.

I hope it helps!

Marked as helpful

1

@MelvinAguilar

Posted

@danielmrz-dev @EmrahIso Hello!!!

The minimum recommended width to consider a solution responsive is 320px. At this width, the design should not break or generate unnecessary scrollbars. You can refer to the recommendations on the W3C page on reflow at https://www.w3.org/WAI/WCAG21/Understanding/reflow.html.

The breakpoints of 375px and 1440px are only references for the dimensions in which the screenshots of the solutions were taken. Your design should be adaptable even on larger screens, including those with resolutions up to 4K. It's interesting to note that with newer smartphones, there might be breakpoints like 280px (as in the Galaxy Fold), but these are not standardized

Happy coding!!

1

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