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

Card com QR CODE utilizando HTML e CSS

@giovanaoliveira-14

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


Tem alguma forma de ter escrito esse código de um modo mais fácil e curto?

Community feedback

Dion 150

@dionlow

Posted

Espero que puedas traducir. Mi español es muy básico.

Some small tips if you would like to use less code. You can rely on css defaults, for example you can remove lines of css to see if you actually need those lines. One thing to consider is that even though flexbox is very powerful, you may not need to use it if you are comfortable using the block default.

Another idea is using utility classes. You have repeated the following in several classes

flex-direction: column;
justify-content: center;
align-items: center;

You can either refactor this layout as a class called flex-column-center and just reference the class in the html instead of defining it several times.

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