Skip to content
Submitted 3 months ago

QR-code component challenge

Robel T. Hawelti•100
@Rapbit27
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...QR code component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

I am proud to do my first project on Frontend Mentor. And I'll definitely do a better on the upcoming challenge.

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

I found trying to put the footer at the bottom of the page challenging, but then I set its position to absolute and gave a margin-bottom value of 0, which made it stick to the bottom of the page.

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

I think I did an okay job, but since its my first challenge here, please give me any and all constructive advises that can help me do a better job. Thanks in advance.

Community feedback

  • MikDra1•6,980
    @MikDra1Posted 3 months ago

    Here are three tips from me:

    • Use a additonal font-family in case the one that you import doesn't do it. Do it like this: font-family: 'Outfit', sans-serif;

    • Never use fixed heights and widths. Instead of it write min-height and min-width.

    • Here is my way of centering the card (you don't have to use it):

    display: grid;
place-items: center;
min-height: 100vh;

    Hope you find this comment useful 💗

    Good job and keep going 😁😊😉

    Marked as helpful
    1

Please log in to post a comment

Log in with GitHub

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