@ApplePieGiraffe
Posted
Hey, Astrid! 👋
Good job and congratulations upon completing your first Frontend Mentor challenge! 🎉
Your solution looks good and responds well! 👍
Your code looks nice, too. I just might only use an <article> tag for the entire component card and separate each section with <div>s (or perhaps <section>s, as yadprab suggested) since that better matches the purpose of those semantic tags.
I think you might be able to use the auto-fit and auto-fill properties to create a responsive layout using CSS grid without using media queries, but since you only have two media queries in your solution, I think you're good!
If you'd like to get even closer to matching the original designs (like you mentioned), check out PerfectPixel—a nice browser extension that lets you overlay images on your website so you can see exactly how your website lines up with the original design images. 😉
Keep coding (and happy coding, too)! 😁
@astridv
Posted
@ApplePieGiraffe wow thank you so much for both the useful response and the encouragement 😍 Will definitely look into auto-fit and auto-fill for future solutions 😄 PerfectPixel sounds like an absolute godsend 🙏 You won't believe how much time I spent staring at the design pics just to try and figure out the spacing, sizing etc. 🤦♀️😂 So I'll definitely have to check that out for future challenges!
I wish you very happy coding as well 😄
