Skip to content
Submitted about 2 years ago

QR Code Component

César Machado•30
@cmachdev
A solution to the QR code component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

This is my first challange, feel free to leave your feedback, I will appreciate it

Have fun togheter coding and learning

Code
Couldn’t fetch repository

Please log in to post a comment

Log in

Community feedback

  • César Machado•30
    @cmachdev

    the text overflowing, in one computer look nice and the other one look with that overflowing, just changing the font-size to 1.3 and 1.4 change one each other, I don't know why, and I will see the h2 and p, thank you

  • P
    Andrea Y Costas•190
    @a-costas

    Hi there! Nice job completing the challenge!

    It looks like you've had a bit of an overflow issue with your text expanding past the edge of your card. This is happening because you've explicitly defined the height of your card at height: 30.94rem;. To fix this, you can remove that height setting, and set the display for qr-card to display: flex; flex-direction: column;. This will allow your card to vertically grow to fit the content within it.

    You shouldn't have to explicitly redefine padding for h2 and p as you've already defined a padding for qr-card and everything it contains.

    Hope that helps and happy coding!

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