Submitted 10 months ago

Html,Tailwind Css,Js

TomasAlbert• 120

@TomasAlbert

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

FAQ accordion

HTML
CSS
JS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

Hi 👋! I wanna share my solution with you guys. I used only one framework and that was of course my favorite Tailwind. For this challenge i was focus on semantic HTML i also tried to implement this with accesibility features so users can navigate with keyboard. For Javascript part it was straight forward i used event delegation for event handlers so i didn't needed to create events for every single element. I will be grateful for any feedback. Happy coding ! 💻

Community feedback

Vaibhav sisodiya• 370

@Vaib215

Posted 10 months ago

Well done Alert! Just FYI, there's a pair of elements in HTML know as detail and summary which are specifically designed for these purposes. You can checkout mdn docs for them or you can checkout my solution for the same.

TomasAlbert• 120

@TomasAlbert

Posted 10 months ago

@Vaib215 Thanks for the reply and the reminder of the details and summary. I like these native elements but always struggle with styling it :)

Vaibhav sisodiya• 370

@Vaib215

Posted 10 months ago

@TomasAlbert Fully agree

Please log in to post a comment

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