Design comparison
Solution retrospective
This is my frist challeng, feedbacks about code are welcome. Thanks for view.
Community feedback
- @gfunk77Posted 10 months ago
Hi! Nice job on your solution and congratulations for completing the challenge. I’ll suggest that you look into how the em unit works because I think it is causing unexpected behavior in your code.In short, Em units compound inside of their containers. Check this out: https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Values_and_units# I’d suggest for now replacing all your ems with px or rem and see what happens to help understand. If you are using vs code you can use the find and replace feature pretty easily to do this. I hope this is helpful.
Marked as helpful2 - @Chenxi96Posted 10 months ago
Hi there,
This looks great! I have some suggestions that you can use if you want.
-
For a more semantic html structure I would recommend having your div.conteiner to be main tag. This helps with SEO performance and accessibility. Use this as reference: https://www.w3schools.com/html/html5_semantic_elements.asp
-
Your p tag that has “HTML & CSS foundation” can have a hover selector that when your mouse hovers on top it can change the elements style. Us this as reference: https://www.w3schools.com/cssref/sel_hover.php
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