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 page with CSS Flexbox

@EIVAR-RIVALDO-PEREZ-AGUILAR

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


What specific areas of your project would you like help with?

RESPONSIVE

Community feedback

@rider48371

Posted

The solution appears to be semantic HTML and is accessible. You could make it easier accessibility for screen readers by adding a main section encompassing the entire project. As far as responsiveness is concerned, if you were to add justify-content: center; and align-items: center; to your flex parent, your items would be centered in the middle of the screen, irregardless of screen size, and it would be much more responsive automatically.

The only other thing that I did notice is that your attribution section is located inside of the card, which in the example, it is outside of the card and slightly underneath it with some margin-top to offset it. That would also help make the card be more like the original design.

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