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

Qr code design with HTML and CSS

omar 30

@Marioomario

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

P
beowulf1958 1,170

@beowulf1958

Posted

You have done a great job so far on this project. The colors and fonts look good, the card is centered on the page, and the card is responsive at small and large screen sizes.

However, there are a few problems that need to be fixed. First, there is no closing </div> tag for the "global__qr"; this could potentially cause problems on some browsers. You can fix this by simply adding a closing tag just before the body tag.

Also, the paragraph bleeds out of the container on the preview website. This is because the container is a fixed height in pixels. Simply remove the height: 499px; from the "global__qr" styles in the css, and everything will be fine. By default, your <div> will apply an auto height to fit the content.

Hope this helps.

Marked as 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