Design comparison
Solution retrospective
I was able to gain more detailed knowledge on responsiveness and best practices.
What challenges did you encounter, and how did you overcome them?Overdoing things in Tailwind and CSS, while truly understanding responsiveness, has been greatly aided by Kevin's videos.
What specific areas of your project would you like help with?Any kind of feedback!
Community feedback
- @AmanoLXPosted 5 months ago
Great solution on how to set the images based on the screen size. Didn't think of that myself!
Just one tiny thing: I never use tailwind.css but seems to me that the card div has a max width of 600 px while the rendering of the image is set to a width bigger than 640px. Shouldn't that be the same sizes?
0@manishsinghrajPosted 5 months ago@AmanoLX
Thanks,
The card has a max width of 600px to match the design (independent of the image width).
However, the mobile img switches to the desktop img at 640px, considering the overall view (i.e., the background and window) and not just card width. This value is taken directly from the Tailwind documentation, where sm: >= 640px is specified. That's why I chose this value. :)
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