Design comparison
Solution retrospective
The thing I'm proud of is actually solving the challenge using my knowledge and provided articles. The css part wasn't hard apart from centering the ::marker
elements in li
.
The 1st challenge I faced was a css one, where I had to center the ::marker
elements in li
because they were not centered. I overcame it by wrapping the li
in a span
and manually adjusting it. As for another challenge I faced which I'm not sure if I solved correctly is hiding and showing the form itself. I was forced to use !important
to overwrite the display
property for the form, because without it the .invisible
class would just be ignored and I couldn't figure out why.
I'd like someone to give me some feedback on the .invisible
class and the !important part of it, because without it, it just wouldn't work and I couldn't figure out why. Any tips or clarification would be great.
Community feedback
- @AhirgautamPosted 9 days ago
very good implementation of challenge. i see you are struggling .invisible class is not working without !important it is because of id has more specificity then class . for styling it is more prefer to use class not id. you can learn more about specificity here you tube link
Marked as helpful1
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