Design comparison
Solution retrospective
I feel like I struggle a bit with making things responsive. I have so far started off making the desktop version first, and then moving on to the mobile view, and usually have to experiment quite a bit to make everything responsive and presentable. One problem I had for example was the fact that when stacked in the mobile view, elements that are stacked at the top simple get cut off, and there is no way of scrolling up there (due to being in a negative position I presume), which I was able to fix by removing my justify-content: center. However I feel like there has to be a more standard way of making it responsive? Any suggestions on best practices in this case?
Community feedback
- @CharlieeLuna23Posted over 2 years ago
First of all, good job!
I can personally recommend to start with a "mobile first" approach. I did it that way and when moving to desktop I only needed to change a few things like the border radius and the display direction instead of column, row as everything was already centered. Just 18 extra lines of code for the media.
Hope this helps for future projects.
Marked as helpful1@yuany2036Posted over 2 years ago@CharlieeLuna23 Thanks for the comment! I just finished another project using this approach, though I'm still getting used to it, so I definitely had more than 18 lines of code haha But again, thanks for the answer and I'll keep this in mind going forwards!
0
Please log in to post a comment
Log in with GitHub
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