Design comparison
SolutionDesign
Solution retrospective
What are you most proud of, and what would you do differently next time?
Styling <ul> and <ol>'s pseudo-element ::marker
What challenges did you encounter, and how did you overcome them?The difficulty was centering the ::marker when there were 2 or more lines in the <li>.
I solved it by putting the contents of the <li> in a <p> and setting to <p>:
- display: inline-block;
- vertical-align: middle;
Community feedback
- @darlene9497Posted about 2 months ago
Good consistent use of CSS variables.
Well done on maintaining the design even on responsiveness.
Using flex-direction: column for the table can cause alignment issues. It's better to stick with the default table layout (display: table) unless you have a specific design in mind.
Overall the code looks solid and follows good practices. Well done!!
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