Design comparison
Solution retrospective
Something I found useful about list-style from MDN website:
Safari will not recognize an unordered list as a list in the accessibility tree if it has a list-style
value of none
.
We can fix this by either adding an explicit role="list"
to the <ul>
element in the markup, or add a zero-width space as pseudo-content before each list item:
ul {
list-style: none;
}
ul li::before {
content: "\200B";
}
Community feedback
- @mycrochipPosted over 2 years ago
Hello Dave,
Congratulations on completing this challenge. I love seeing results that are picture-perfect, such as the one you put forward.
Great job and thanks for the tip.
#I also copied your max-width for the desktop view in completing my own version of the challenge as well. The solution URL below will be active as soon as I make my submission:
https://github.com/mycrochip/single-price-grid-component.git
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