Skip to content
Submitted almost 3 years ago

Responsive Product Card Component

Emmanuel Munyite•510
@munyite001
A solution to the Product preview card component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Any and all feedback is welcome.

Code

Please log in to post a comment

Log in

Community feedback

  • Fatlind Shehu•2,230
    @fatlindshehu

    Hi Emmanuel, Nice work over there! Here are my suggestions on how to improve your card:

    • Create a main component and center it in the middle using flex
    • Create two child components inside the main one for the image and one for the text use flex to align them.
    • Give padding around the text component in order for the element to be in line with one another.
    • Using flex change the flex-direction: column to make the component responsive on smaller devices.
    • If you're unfamiliar with flex check this LINK

    Keep up the good work

    Marked as helpful

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