QR code component

Community feedback

• 

  Lucas 👾•104,160

  @correlucas

  Posted almost 3 years ago

  👾Hello Achinta Haldar, congratulations for your new solution!

  🎯 Your solution its almost done and I’ve some tips to help you to improve it:

  Your component is perfect, but is not responsive yet, this is due the fixed width you've applied to the container.

  Look both width and max-width the main difference between these properties is that the first(width) is fixed and the second(max-width) is flexible, for example, a component with width: 320px will not grow or shrink because the size will be ever the same, but a container with max-width: 320px or min-width: 320px can grow or contract depending of the property you've set for the container. So if you want a responsive block element, never use width choose or min-width or max-width.

  .container {
      background-color: hsl(0, 0%, 100%);
      max-width: 320px;
      height: 470px;
      /* margin: auto; */
      position: relative;
      top: 91px;
      border-radius: 5%;
  }
  

  ✌️ I hope this helps you and happy coding!

  00

  Marked as helpful