Design comparison
Solution retrospective
First time building an accordion, as it were. In the app.js file, you'll notice I wrote many variables to individually target each question and answer element. I wrote the same logic twice because I don't know how to loop through each target without getting errors. Thanks always for any feedback. Current following this code-along to troubleshoot and debug.
https://www.youtube.com/watch?v=FboXxLxg8eo&t=337s
Other notes:
I don't know how to center the <hr> tag. I don't understand what it is that enables margin and padding to apply or why it doesn't.
Community feedback
- @cujothechiefPosted about 2 years ago
hi @funupulu. great start you have here. I've looked through your code and what you do is to set a class on the elements that are the same(you can create a class for all arrows, answers and questions). then you can getElementsByClassname for each class and use a forEach to loop through each element for each class. also you can use a ".classlist.toggle" to add and remove the styles. hope this helps!
Marked as helpful0
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