Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
2
Comments
3
Robert
@RobertLikesCoding

All comments

  • Zepar•20
    @Crimson-repere
    Submitted over 1 year ago
    What are you most proud of, and what would you do differently next time?

    nothing.

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

    Getting the size and font-size.

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

    The width and height of the elements.

    Blog review card solution

    1
    Robert•40
    @RobertLikesCoding
    Posted over 1 year ago

    Great job, your card looks identical! HTML looks nice and tidy with semantic tags 👍 You forgot about the hover/levitate effect though :)

    Let me know if you update this!

  • Ayşen Alpaslan•20
    @AysenAlpsln
    Submitted over 1 year ago
    What are you most proud of, and what would you do differently next time?

    I quickly pulled out the design, but next time I'll examine the figma content in more detail.

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

    I had a hard time finding the font family value in Figma, but I learned how to find it by doing some research.

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

    There is no place I can ask for help.

    Frontend Mentor - QR code component

    2
    Robert•40
    @RobertLikesCoding
    Posted over 1 year ago

    Hey there Aysen!

    Great job! This is very close to the original 👍 I read you were struggling finding the right font-family. Have another look in the project folder. There is a style-guide in there that gives you the font-family.

    Another small improvement you could keep in mind for the next challenge is more semantic HTML tags. Instead of the span tags rather use h1 and p and maybe even mainfor the main div. It seems irrelevant for tiny challenges like this but I think it's good practice to do it even for small projects :)

    Hope this helped!

  • nxll0•20
    @AllanShima
    Submitted over 1 year ago
    What are you most proud of, and what would you do differently next time?

    Not sure if I got close to the real result, but i should study more tags and elements from css.

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

    Confused on how to center the elements on to the screen. But i overcame them by googling possible tags and properties in both html and css.

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

    Definitely when you're supposed to move the element somewhere specific on the screen. In this case, i feel like it was way too difficult to center the card exactly in the middle of the site.

    QR Code card

    1
    Robert•40
    @RobertLikesCoding
    Posted over 1 year ago

    Hey Allan!

    Nice work! I saw you were struggling with the positioning and ended up using absolute positioning. One way I like to use when dealing with these big one page designs with something centered in the middle is setting the section or div elements' height: 100vh. This gives you a full-screen to place your element in. You could then center it using display: flex, justify-content: center, align-items: center for example.

    Try it out if you want. :)

    One other tiny thing I noticed was your alt tag in the img element. I know this is just a challenge but you could make it more descriptive than just saying "qr-code". I like to imagine a screen reader reading the alt tag back to me and then ask myself "Would I understand what is on the picture?".

    I hope this was helpful! Happy coding!

    Marked as helpful
Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub