Skip to content
Submitted 3 months ago

faq accordion, html scss js

sass/scss
Salim•380
@limsael
A solution to the FAQ accordion challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

What specific areas of your project would you like help with?
  • The accordion itself. This was my accordion so any feedback on how to improve it would be welcome.
Code

Please log in to post a comment

Log in

Community feedback

  • P
    Emmanuel Lopez•550
    @EmLopezDev

    Good job on completing the challenge, it looks great. Keep doing great work.

    A few things to point out:

    • The look of the card is a bit off there isn't enough padding on the edges of the card.
    • When view on a smaller display, the card isn't centered on the viewport.
    • When the display is made really big the background image doesn't take up the full width;
    • Missing visuals for focus. If you tab through the page it should show you what is being focused.
    • You can make the whole accordion item div have the onclick to open and close it makes for a better experience to be able to click anywhere and have it open and close especially for accessibility needs.
    • Also look into using the <details> tag for the accordion it is intended for these kind of components and has the ability to open/close built in so you don't even need JS.
    Marked as helpful

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