Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Flex, Gird & Media Queries

P

@simokitkat

Desktop design screenshot for the Social proof section coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


I would appreciate any feedback.

Community feedback

arey 350

@arey-dev

Posted

Great work! I like your layout between 768px - 992px!

Here's my few comments.

  • You can write @media (max-width:992px) just once, and put all the CSS rules that you want to fall under that viewport size.
  • And maybe, try to maintain the same spacing that you have from 768px - 992px on the top and bottom of the page under 768px viewport width.

Marked as helpful

0

P

@simokitkat

Posted

@arey-dev

Thank you for your feedback!

I checked your solution of the same challenge and I liked it very much too.

I thought of putting all the CSS rules of @media (max-width:992px) at once, but I thought that in case that was a real project , it would be easier to edit the media queries if they are written right under the original ones. Not sure if that's the best practice though.

1
arey 350

@arey-dev

Posted

@simokitkat It's nice that you are writing your code under the presumption of it being a real and bigger project. You can read this guide. This will help you organize your css when doing more complex projects.

1

Please log in to post a comment

Log in with GitHub
Discord logo

Join 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