QR code component using CSS Flexbox

Hey Mahad, congratulations on completing the challenge 😉

Some little tips for optimizing your code:

• add main tag and wrap the card for improve the Accessibility
• remove all unnecessary code, the less you write the better as well as being clearer: for example the div container of image
• remove height from .container class because isen't necessary
• remove all margin from .container class because with flex they are superfluous
• use min-height: 100vh instead of height to the body
• instead of using px or % use relative units of measurement like rem -> read here it's much better!

Hope this help! Happy coding 😁 by Travolgi

Hi @mahadaamir35 since you used display flex on the .container u could use gap:0.8rem; instead of margin-top:0.8rem; check this: https://developer.mozilla.org/en-US/docs/Web/CSS/gap

And to create an equal white space around the items inside .container just use padding (make sure to remove the margin-top from the img)