Design comparison
Solution retrospective
Hello, coders! I'm happy to introduce you my project where I used @media for the first time. I know it's very simple but I'm proud that I'd overcome this fear of the @media. I've an issue after (max-width: 480px) breakpoint that my block doesn't center anymore and I can't understand why. I'm looking forward to all your critics and thanks for checking this out! Happy coding!
Community feedback
- @RayaneBengaouiPosted over 3 years ago
Hello Maksim Deviatilov,
Congrats for your first time using media queries ! 🥳
I'd like to suggest :
-
The last card's color seems a bit off, you use
background-color: hsl(179, 94%, 18%)
while I think it should bebackground-color: hsl(179, 100%, 13%)
. -
With the media query I would recommend you to look at mobile first concept for building your CSS, it's quite nice to understand how to manage media queries. Here, the problem is that with your media query range if we have a 360px wide phone, then it goes back to your original CSS declaration. So I would remove the
min-width
from it. The same applies if we are a little bit above (~600px). -
Use
font-style: inherit
on your buttons so that they can inherit aswell the font you declared.
Overall, well done for the challenge and happy coding ! 😃
1@maksimcoderPosted over 3 years agoHello, Rayane, thank you for all your comments, I really appreciate them. I've fixed the
font-style
andbackground-color
problem and will solve the query issue as soon as possible. I'm delighted with the fact that I've found this resource where great people help each other. Thanks a lot and have a nice day!1@RayaneBengaouiPosted over 3 years ago@maksimcoder Your welcome ! Hope to see you soon on another challenge ! 🙂
And don't forget to update changes on your solution 😉
0 -
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord