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

Semantic HTML5 markup, CSS custom properties, Flexbox

@joaomarcosSR

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 are you most proud of, and what would you do differently next time?

To complete the challenge.

What challenges did you encounter, and how did you overcome them?

Align qr-code.

Use Flexbox.

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

About the use of tag section. Is It the best tag to this case, or I should use div?

The id card is a good name or should be more specific? Like qr-code-card

Community feedback

P. Ricardo 2,370

@pRicard0

Posted

Yo! So... I'll try to answer your questions

  • From my point of view, your <section> is wrong. When our project needs a <section>, we expect more than one. For example... image section, text section, etc... You should at least wrap your <div class="attribution"> with a <section>. By doing so, I think your project will still be wrong because your card should be your <main> tag and you should use <footer> instead of <div class="attribution">. Header and footer should not be included inside the <main> tag. Summing up, remove the <section> tag and your <footer> should be outside the <main> tag
  • Your id is okay, you don't need to specify more than that. This is just a simple project
  • You should try using rem instead of em

Marked as helpful

1
Theviod616 160

@Theviod616

Posted

congratulation on your website, you need to work on making it responsive on mobile, you can use the developer tools, to view it in smaller screen size then you would get a better idea.

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