Product Preview Card Component

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  👾Hello Gift Charles, congratulations for your first solution and 😎 welcome to the Frontend Mentor Coding Community!

  Your solution is fine and the design is really good, the only thing I think you really need to fix is the image that is not responsive and is distorting to fix this behavior use in the img selector object-fit: cover

  See the changes I did to your code:

  img {
      display: block;
      max-width: 100%;
      object-fit: cover;
      height: 100%;
      border-radius: 1em 0 0 1em;
  }
  

  👨‍💻 Here's my solution for this challenge if you wants to see how I build it: https://www.frontendmentor.io/solutions/product-preview-card-vanilla-css-and-custom-hover-state-on-hero-85A1JsueD1

  👋 I hope this helps you and happy coding!

  Marked as helpful

  0

  ---

  

  Gift Charles•50

  @GiftCode27Posted over 2 years ago

  @correlucas Thank you so much for your feedback. I'll make the correction right away.

  1

  

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  @GiftCode27 Hey Gift, I'm happy to hear that was helpful. Keep it up!

  0

  

  Gift Charles•50

  @GiftCode27Posted over 2 years ago

  @correlucas Thank you!

  0