Responsive solution using Flexbox

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  👾Hello @nzewi, congratulations on your first solution!👋 Welcome to the Frontend Mentor Coding Community!

  Nice code and nice solution! You did a good job here putting everything together. I’ve some suggestions for you:

  Your don't need to use media queries for this challenge, this component is so tiny that making it responsive is enough to make it fit in big and small screens. You've already used max-width so there's only one more thing to improve the card responsiveness, the image is getting stretched because you've set a fixed height, remove it and place max-width: 100% and display: block to have your image resizing with the container:

  img {
      display: block;
      max-width: 100%;
  }
  .card__img {
      border-radius: 1rem;
      /* height: 35rem; */
  }
  

  ✌️ I hope this helps you and happy coding!

  Marked as helpful

  0

  ---

  

  Nelson Nzewi•270

  @nzewiPosted about 2 years ago

  @correlucas Thank you

  0

  

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  @nzewi Bro Now you can write your own feedback and show your ideas to help other person =)

  0

  

  Nelson Nzewi•270

  @nzewiPosted about 2 years ago

  @correlucas I'm sorry about that. I didn't mean to offend you. I just thought you articulated what was in my head very well and I added it as part of my feedback. I won't do it again.

  0

  

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  @nzewi Thats fine Nelson I am fine. I think if you wrote your own review will be better and you'll help more person showing your point of view. I mean, you've done one challenge so you can write many reviews about the difficults you had and help other person. You already know the concepts so you can write it with your own words.

  Marked as helpful

  0