QR Code 2

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  Hello Ifenna, welcome to the Frontend Mentor community and congratulations for your solution!

  I take a look on your QR Code component solution and everything seems fine, you need only to adjust few things to make the card flexible and responsive.

  1.Inside the container you can use max-width instead of width to make the card shrink when the screen get smaller, using width your card get a fixed value and don't change size. You don't need to set the height, the height of the card will come from the padding/margins you set between the elements as the img and the heading.

  .container { background-color: hsl(0, 0%, 100%); max-width: 320px; }

  2.Set the image as display: block; to have a proper behavior inside the container and avoid that the image will go out from the container when get stretched.

  img { display: block; width: 100%; padding: 24px; border-radius: 10px; }

  Try it out and say if works bro, feel free to ask me further questions!

  0