Responsive FAQ with collapsible sections HTML & CSS only
Design comparison
Solution retrospective
Hey! I made a small change to the layout where I had the accordion container expand as the accordion expanded. To make the accordion expand on click I used an input check box to trigger changes. I have seen other solutions on stack overflow to similar problems use <a> tags too. Would love to hear explanations for why <a> tags may be better for this purpose. If any feedback comes to mind please do not hesitate to write it down as it helps me develop my programming skills :)!
Community feedback
- @SheGeeksPosted over 3 years ago
Could you clarify what "tags" you're referring to?
Great work on this challenge! I think the checkbox approach typically ends up being an accessibility nightmare, which your report mirrors. Since you used this approach, I would review the accessibility errors and fix them where you can.
Feel free to check out my code on this challenge for a different approach and inspiration.
Marked as helpful0@Tyson-WellingsPosted over 3 years ago@SheGeeks Realized there was a typo on my question. But you pretty much answered my question. I could have used a tags (anchor) to create the clickable accordion with CSS this would have avoided the accessibility issues. Thank you for taking the time to provide me with feedback!
0@SheGeeksPosted over 3 years ago@Tyson-Wellings Using the a tags is a great alternative and should help reduce the accessibility issues of the checkboxes. Glad my comment could inspire your own thinking towards another approach.
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