Submitted almost 4 years ago

CSS only Accordion (no JS challenge)

@BenjaDotMin

A solution to the FAQ accordion card challenge

Solution retrospective

Hello all, I decided to try my hand at the bonus challenge listed in the project notes (no JS). The accordion is a pure css approach, with no use of JS to toggle the accordion. Please let me know if there is a better solution!

At first this layout seemed obvious, but I ran into a few issues, such as how does the card behave if more than one accordion is open, and how it should wrap down for tablet views (no design provided). I made a few decisions myself, and I hope it works well.

As always, I look forward to any advice.

Code

Please log in to post a comment

Community feedback

No feedback yet. Be the first to give feedback on Benja.min's solution.

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