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 Page with CSS

@ardaacikgoz

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?

I have forgotten after not studying for a while, but after some time I understand what to do and which part to manipulate. Then I have revised the code but sometimes I had to ask to ChatGPT which is I am not proud of. I will try to check less ChatGPT and check the Internet more by manually in the next time.

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

I didnt understand this display:flex display: float etc. when learning for the first time and still dont understand fully, that is why I used ChatGPT at some point.

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

Did I use divs correctly? Did I use CSS codes next to the body directly correctly? Should I have used these CSS codes by opening style?

Community feedback

@Marcod01

Posted

Your use of the <div> element is pretty good for wrapping the QR code and text together. The class name attribution works, but you could try naming it something like qr-container to make it clearer what the <div> is for, especially if the project gets bigger.

As for the CSS you've put directly in the <body>, it does the job, but it’s better to move those styles to a separate CSS file or at least into the . This makes your code cleaner and easier to update later if you need to make changes. Overall, your combination of inline and embedded CSS works, but separating your styles from the HTML will help in the long run. You've done a good job centering everything with Flexbox, and the QR code with the text looks well-balanced.

In summary, your code is functional, but moving styles out of the body tag and organizing them better would be a nice improvement.

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