
Design comparison
Solution retrospective
What I'm most proud of:
I'm most proud of strengthening my understanding of CSS properties. I took time to analyze the solutions I implemented in my previous projects and identified ways to improve them. By revisiting my approach, I was able to optimize my code and make it more efficient.
What I would do differently next time:
Next time, I plan to rely more on the community for solutions. Currently, I tend to look for quick fixes from easier sources, but I think engaging more with the community and seeking help from forums, blogs, or code reviews will allow me to learn more effectively. This approach will help me build a deeper understanding and develop better coding practices.
What challenges did you encounter, and how did you overcome them?There weren't many challenges in this project, as the solution was quite similar to the previous one, with only a few additional extensions. The familiarity with the approach made it easier to implement the new features without significant difficulties.
What specific areas of your project would you like help with?I believe my code has some browser compatibility issues. While it works well in Chrome, the CSS seems to break in Firefox, and I'm unsure why. I would greatly appreciate any guidance on this. Additionally, I feel that my responsive approach could be improved, so any suggestions to enhance it would be highly appreciated.
Community feedback
- @reddevotionPosted 4 months ago
Hey Dinesh, nice job.
I think you have some issues with extra margin for your p tags.
For the responsiveness without media queries i can suggest you to use a css clamp() function to make font sizes different on different screen sizes. This function can be used like this: font-size: clamp(12px, 1vw, 14px); 12px is the minimum font-size can get, 14px is maximum, 1vw is 1% of viewport-width and it is the value that will be used as long as the result is between the minimum and maximum values. it can be used for width and height too. I'm new to it myself but i hope it was helpful:/
Marked as helpful0 - P@SaiDineshKopparthiPosted 4 months ago
Hi! I’ve used
clamp()
as you suggested, but I’ve limited it to just the base font size for now. I really wanted to use it for other properties as well, but since I’m still a beginner, it’s a bit confusing at the moment. However, usingclamp()
and removing the media query definitely improved the overall look of my solution.Thank you so much for taking the time to share your suggestions. Wishing you all the best on your journey as well!
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