Skip to content
OverviewSolutions
2
Comments
3

TonyHe

@tonyhaohe20 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

Latest solutions

Latest comments

  • TonyHe•20
    @tonyhaohe

    Thanks to the user who deleted their message for the feedback. I thought that pixels would also scale up with user-set base font size (but apparently not, just for zoom) so I didn't use rem for those fonts. Or I forgot/somehow slipped my mind. But thanks. I'm gonna fix this now. Yeah it's a small detail, but I think it's good to know.

  • ore•270
    @remberf1

    done

    2
    TonyHe•20
    @tonyhaohe

    Nice job. Nothing wrong with eyeballing if that's what you were after, but did you use the figma file? The figma file also contains links on how to use figma well.

  • FahmidaToma•70
    @FahmidToma
    What are you most proud of, and what would you do differently next time?

    I am mostly proud of the responsiveness that I managed to do as close as possible with media query and next time I will parallely code the responsive and non responsive css part.

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

    I encountered that I was having issues while managing the img in the right position. I overcame it with the help of figma and took a little bit of help of chatgpt.My concept got cleared

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

    The padding area of the div which is causing problem...while using balanced padding the qr image is in the imbalanced position on desktop view

    Responsive QR component using CSS Flex

    3
    TonyHe•20
    @tonyhaohe
    1. Use more semantically correct HTML for accessibility and better SEO. You can replace the section with main, probably div for article because it's a self-contained block of content.
    2. Your CSS could be improved. The .card has 40px for some reason on one side but 16px on the rest, it looks unbalanced. Do padding: 16px. But if you do that, the image isn't centred. You can choose to get rid of width and height on the image and just do max-width: 100%. Or if you want to keep the size, you can just turn add display:block to the image and then margin: 0 auto. There's also other stuff, but that's just my brief look.