Skip to content
Submitted 11 months ago

FAQ Accordion using HTML and CSS

P
David Blackman•140
@defenstration
A solution to the FAQ accordion challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

What are you most proud of, and what would you do differently next time?

I wanted to challenge myself to do this without JS and had fun learning about checkmarks and more pseudo-selectors. If I were building this for a scalable site I don't know as that is viable, but most FAQ pages don't seem to change much and I felt it was good to learn this approach.

Code

Please log in to post a comment

Log in

Community feedback

  • Account deleted

    Hey @defenstration! Great work 👏 on completing this challenge with CSS! I have a few suggestions for your solution:

    1. It is not accessible for those who use screen readers. You can improve accessibility by adding ARIA attributes or using semantic HTML elements like details.

    I hope you find this helpful. 😊

    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