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 with basic html and css

Andres Ceronā€¢ 50

@JesuCeron

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


All your comments and recommendations are welcome

Community feedback

Haleā€¢ 330

@halelite

Posted

hi @JesuCeron!

Good job! Your solution looks great!

I just noticed a small thing about your CSS. In the design, the component is centered both horizontally and vertically. I suggest you center your component vertically as well, so your project looks way much better. There are a lot of ways to center it. Some of them are:

  • using flexbox
  • using margin or padding
  • using absolute position property
position: absolute
top: 50%;
transform: translateY(-50%);

Other that that great job! šŸ‘

I hope it helps!

Marked as helpful

0

Andres Ceronā€¢ 50

@JesuCeron

Posted

@halelite Thanks for your advice.

0
Saleiuxā€¢ 250

@Saleiux

Posted

Good job! some suggestions:

  • Your card look so much smaller than the one in the example, you can align it in the center of the page with flexbox, for example, and after working with size and width for making it more similar as possible to the example
  • Add a readme.md file in your repo with an overview of your project, it will help visitors to understand what you did and with which stack
  • For this project it was not necessary but try to use semantic html in your projects, like main, section, footer...
  • I suggest you to call your .css file styles.css it will be more clear in bigger projects
  • In your folder "qr-code-component-main" you have many file that you can delete. I hope those tips can help you to improve, good luck!

Marked as helpful

0

Andres Ceronā€¢ 50

@JesuCeron

Posted

@Saleiux Thanks for your advice.

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