Design comparison
Solution retrospective
I didn't look up too much for this project, and I experimented with CSS nesting. Next time I'd hopefully just write the code much cleaner and more efficient.
What challenges did you encounter, and how did you overcome them?A simple design but it took a lot longer than expected. Mostly getting the image right on both desktop & mobile since it's a different image on each layout. I used two different divs and hid the one that wasn't needed. That is probably not the best way to do it, but it works!
What specific areas of your project would you like help with?Any feedback regarding CSS nesting, responsive flex, custom CSS properties... or just anything haha. All comments are appreciated. Thanks!
Community feedback
- @AbsyntheePosted 9 months ago
Not sure why the image isn't previewing properly on the github page & in the screenshot above. You can see it in the screenshot in my repository here: https://github.com/Absynthee/product-preview-card-component-main.
Edit: fixed the above problem, but my new generated screenshot is not ideal!
Edit2: fixed above issue after generating new screenshot. Perhaps just some caching issue? Either way, happy with the result now.
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