Skip to content
Submitted over 2 years ago

responsive product-preview-card-component-main

eadq001•100
@eadq001
A solution to the Product preview card component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

to the one who will review this code, thank you. i am hoping for your feedback on how can i improve my skills.

Code

Please log in to post a comment

Log in

Community feedback

  • P
    Nikitossik•370
    @Nikitossik

    Hey, good job)

    Here are some improvments I'd like to tell you:

    • instead of adding 2 <img> tags, you can use <picture> to change the image on the certain breakpoint if needed
    • when you flip the content on the mobile version, you could change a @media query to max-width: 700px (card width), because a horizontal scrollbar appears between the breakpoints. Or you could change width: 700px to max-width: 700px, just to avoid fixed width, because it can cause issues

    Good luck)

  • MohamedRiya-prog•60
    @MohamedRiya-prog

    -Could have aligned the button to the center. Product description font weight could have been adjusted too.

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