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

HTML5, CSS3 and BEM

Felipe OGβ€’ 730

@felipeog

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


Any feedback is appreciated!

Community feedback

Arturo Simonβ€’ 1,785

@artimys

Posted

Hi Felipe, You did a really great job hereπŸ‘πŸ‘

You got a good grasp on html semantics, clever using radio buttons to toggle. I'll need to try that. The transition works really well on desktop. They don't seem to do a big jump when opening

Keep it up!!

1

Felipe OGβ€’ 730

@felipeog

Posted

Hello, @artimys! Thank you again for the feedback.

It really was a challenge to build it with HTML and CSS only. I have seen the radio button trick somewhere before, I don't remember where.

Unfortunately the mobile version do some noticeable jumps when opening and closing the accordion, I plan on fixing it in the future.

Thanks again for taking the time to take a look!

1
P
ApplePieGiraffeβ€’ 30,545

@ApplePieGiraffe

Posted

Oh, yeah, Felipe Oliveira! πŸ˜ƒ

Your solution does look very good and work well (I really like the transitions when opening and closing FAQs in the accordion card, too). πŸ‘

Happy coding! 😁

0

Felipe OGβ€’ 730

@felipeog

Posted

Hello, @ApplePieGiraffe! Thanks for the feedback, I really appreciate it.

Happy coding!

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