Responsive QR-Code Design using Html and CSS

What are you most proud of, and what would you do differently next time?

I have done my best to make sure that images with different resolutions can easily fit the image container.

I also made sure to add media query so that even on the smallest device the content as well as the image can easily fit the viewport.

I tried to make the design as accurate as possible which I can proudly say looks almost the same as the design provided.

What challenges did you encounter, and how did you overcome them?

The only challenge I encountered was making sure the image properly fits its parent container or element. Here is the code :

#image-container{
    max-width: 100%;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
#image-container img{
    max-width: 100%;
    object-fit: cover;
}

What specific areas of your project would you like help with?

Is there any other easier and more efficient method to fit any image in a container?