
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.
Please log in to post a comment
Log in with GitHubCommunity feedback
- @Ahirgautam
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 helpful
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