Skip to content
Submitted 5 months ago

FAQ-Accordion

Mohammad Fallah•60
@mohammadfallah7
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...FAQ accordion
  • HTML
  • CSS
  • JS
1newbie

Design comparison

SolutionDesign

Community feedback

  • Alexandru736•210
    @Alexandru736Posted 2 months ago

    Hi @mohammadfallah7

    I have two remarks on your solution:

    • First, regarding your background-image, for larger screens, it doesn't fully stretches the screen width. For the <body> tag, you could set the 'background-image: url('your-image')' and the background-size: contain. It might not stretches the ideal way, but at least it does the trick.
    • Secondly, you have overloaded your js script. Ideally, make your HTML with all attributes and elements you need. For example, you could have added both buttons for each question and set the default one with display: block and the other one with display: none. Then, instead of creating an active type of class, you could have used ARIA attributes like aria-hidden="true" and when you click the button, the attribute of the default button would have the value true and the other one false, and so on. Overall, great project and good job on using SCSS. Keep up the good work!

    Best, Alex

    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