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

Animated FAQ accordion

Thibault 205

@thibault-barrat

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


Hi,

This challenge was quite fun :) Any feedback would be appreciated

Thanks

Community feedback

Thibault 205

@thibault-barrat

Posted

Thank you for your feedback.

You're right the background picture is moving when an answer is opened. I didn't see that. It is because I used a percentage to set the absolute position of the background-image but it is probably better to use pixels.

1

@abhineetkandele

Posted

Great Job!!

Try building this without using JS. Use details & summary HTML tags for accordion and picture tag for different images in different breakpoints.

0
Art 420

@Art-wdt

Posted

Hey! I love your job! Looks great!

But what about keeping your block height fixed? Now the picture of the background is driving parallel to the answers. Maybe I'm wrong.

In any case, your work looks cooler than mine. I also did this and used jQuery.

Happy coding!

0

Marius S. 40

@MariusSMA

Posted

@Art-wdt Yeah, that's the issue with the images moving, I had the same issue and fixed it with fixed height.

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