QR Code Website challenge using HTML and CSS

Community feedback

• 

  Abdul Khaliq 🚀•72,560

  @0xabdulkhaliqPosted over 1 year ago

  Hello there 👋. Congratulations on successfully completing the challenge! 🎉

  • I have some recommendations regarding your doubts that I believe will be of great interest to you.

  ---

  SUGGESTION 💡:

  • "While positioning the images inside the <div> tag, the image is not behaving according to the sizing of <div> tag. How can I solve that?". First we need to know why this issue is arised, It's just because the fixed width of img element.

  ---

  • Your code

  img {
    width: 250px;
  }
  

  ---

  • We can fix it by the following code

  img {
     width: 100%;
  }
  

  • Now the issue has been cleared.

  .

  I hope you find this helpful 😄 Above all, the solution you submitted is great !

  Happy coding!

  Marked as helpful

  1
• 

  Larra•10

  @larrasuPosted over 1 year ago

  You can improve the look of the card by adding more padding to the contents of the card. It's a little bit compact compared to the original design. Overall, the card component looks great!

  To answer your question, you can do so by doing this:

  img {
      width: 100%;
      height: 250px; //specify image height
      object-fit: cover; // this keeps the image's aspect ratio and fills the given sizes
  }
  

  I hope this helps. Happy coding! ✨

  Marked as helpful

  1