QR code component (html + css)

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  👾Fala Luciano, tudo bem? Parabéns pelo desafio!

  Olhei seu código e deixei algumas sugestoes pra vc:

  Pra deixar o container responsivo junto com a image vc tem que remover os width e min-width e usar somente o max-width: 285px pro container escalar

  Aqui as mudancas que fiz pro seu codigo:

  main {
      max-width: 285px;
      background-color: hsl(0, 0%, 100%);
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      /* max-width: 21%; */
      padding: 15px;
      border-radius: 20px;
  }
  

  O melhor jeito de usar a image aqui seria inserindo ela dentro do html com <img>, pelo background-image vc tem mto pouco controle, pra deixar ela responsiva use display: block e max-width: 100%

  .code {
      display: block;
      max-width: 100%;
      /* background-image: url(images/image-qr-code.png); */
      /* background-size: cover; */
  }
  

  👋 Espero ter ajudado e continue no foco!

  Marked as helpful

  1