Responsive QR code card using CSS and HTML

Community feedback

• 

  Lucas 👾•104,400

  @correlucasPosted about 2 years ago

  👾Hello Mathan, congratulations for your new solution!

  The only reason your component card is not responsive yet is due the img setup, a best practice for the images is to use display: block and max-width: 100% this helps you manage images and also means that the image will have the size of the container it is inside less the paddings.

  See the code fixes below:

  img {
      display: block;
      border-radius: 0.625rem;
      max-height: 17rem;
      max-width: 100%;
  }
  

  Improve the box-shadow working the values for opacity and blur. If you give it more blur and less opacity you'll have a smoother shadow.

  👋 I hope this helps you and happy coding!

  Marked as helpful

  0

  ---

  

  Mathan Kumar•40

  @gmathankumarPosted about 2 years ago

  @correlucas thanks for taking time and review it. I'll go through the suggested changes.

  1