Design comparison
Solution retrospective
Usage of ems instead of direct px values , organize the classes better
What challenges did you encounter, and how did you overcome them?styling the buttons
What specific areas of your project would you like help with?better css styling
Community feedback
- @R3ygoskiPosted 7 months ago
Hello @Neelxxx, congratulations on completing your project. The styling you did looks very good and much more original.
I'd like to give you a tip regarding your CSS. I noticed that you used
width: 24em
on your card, which made it have a fixed size and ended up making it unresponsive on smaller screens, like 320px. If you want to fix this, I strongly recommend usingwidth: clamp()
, as it allows you to make a more refined limitation for your card.I used these settings on your card:
width: clamp(300px, 90%, 24em)
and it turned out to be a reasonably good size. I did the same thing for the buttons, but instead of 300px, I used 280px.If you're not familiar with the
clamp()
function, let me explain briefly. It's used to limit a minimum value, a base value, and a maximum value that your element can have. I highly recommend it if you want to work with responsive solutions.Again, congratulations! Your project looks really nice. Keep practicing and improving. If anything I said isn't clear, please comment below, and I'll try to help as best as I can.
Marked as helpful1@NeelxxxPosted 7 months ago@R3ygoski Thanks! for taking the time to review and for the feedback :) , will definitely consider this going forwards :)
1 - @sivaprasath2004Posted 7 months ago
Hello i`m wishing for your completion in this project.
- I will be see in your code
- HTML to include a challenge and the author's name. Here's how you could do it:
<footer> <p>Challenge by [Your Name]</p> <p>Author: [Author's Name]</p> </footer>
- Feel free to replace [Your Name] and [Author's Name] with the appropriate names.
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