Responsive QR-Code for FrontEndMentor

Hello R.J. , your solution is good but i will give you a few tips :

1. use in your html classes instead of ids .
2. if necessary, do not use heights ,
3. this is a very important one , all sites are responsive even if you don't use css ( you should give it a try )
4. if you can do mobile first , it's easier to go from smaller to bigger screens , less media queries needed and lastly -- check out Kevin Powell's youtube channel , he is a css wizard in my opinion. I hope these tips can help you in your further career as a web developer

happy coding

Hello R.J. Welcome to the Frontend Mentor community! Congrats on completing your first project! It looks great. Anyway, I have a few suggestions for you

• Your website is not completely responsive. Most of the times, to achieve responsiveness web designers use media-queries. But in this case, using the min-width property would suffice.
• You have used a div with the ID "main". Instead of this, the tag <main> could be used itself

Now, answers to your question

• There are several ways to make responsive designs. Most of the times, they should be used in conjunction with one another
  • Using media-queries, as mentioned above
  • Using units like percentages
  • Using properties like min-width and min-height
  • Using the srcset attribute on images And many, many more. I would suggest you watch this video by Kevin Powell, who, I agree 100%, is a CSS wizard.
• Being mobile-first is not the best option a hundred per cent of the time. However, 95 per cent of the times it is. It just depends on your target audience. Your solution to challenge should be mobile first, because I would expect most people to visit the website on their mobiles. However, while creating something like Power BI, it's better to not be mobile-first because the audience will use the application on their laptop screens. I would suggest you to read this article.