Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

FAQ Accordion card (HTML, CSS & Javascript). Feedback needed 😊

@ubaydillah77

Desktop design screenshot for the FAQ accordion card coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


it's kinda hard though with a lot of images.

Any feedback will be great for my improvement, Thanks ✨

Community feedback

Vanza Setia 27,795

@vanzasetia

Posted

Hello there, @ubaydillah77! 👋

Good effort on this challenge! 👍

Never use div for interactive elements. The general rule of thumb is to always use interactive elements for anything that is interactive. In this case, you can use the native HTML element to create the accordion which is details and summary. By default, they are accessible by keyboard and screen readers and have open and close functionality. However, you can still create functionality that only allow the user to only open one accordion panel at a time to prevent the card from having a lot of height.

Also, I would recommend using forEach instead of the traditional for loop. This way, your code looks modern and much shorter compare to for loop.

That's it! Hope this helps. 😊

0

Please log in to post a comment

Log in with GitHub
Discord logo

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