![](https://res.cloudinary.com/dz209s6jk/image/upload/f_auto,q_auto,w_900/Screenshots/r0kflitajqc9r4ctscup.jpg)
Submitted 4 months ago
FAQ accordion - CSS only, semantic HTML, and keyboard accessibility
#accessibility
P
@elisilk
Design comparison
SolutionDesign
Solution retrospective
What are you most proud of, and what would you do differently next time?
This one was a ton of fun. After looking around a bit about how to implement a CSS only accordion, I finally stumbled across the element
, which was perfect for the job. Semantically appropriate, accessible, and easy to implement.
I am a little confused about why I'm getting some HTML validator errors by using the name
attribute in the details
elements. Can anyone help me figure out what I did wrong? Seems to me like I am using the name
attribute in the appropriate way. But maybe I am missing something? 🤔
Community feedback
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