Submitted almost 3 years ago

Responsive FAQ Accordion Card with JS, CSS Grid, and Flexbox

Brendan• 170

@brendanmadden

Preview site View code

This is a solution for...

FAQ accordion card

HTML
CSS
JS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

Hi Everyone,

I had a blast learning to build an accordion with JavaScript for this challenge!

I have a couple of questions for anyone who might be able to help:

How can I get that box to stay where it should while resizing the browser?
Why aren't my accordions collapsing with a transition like they do when they open?
How can I get the mobile image to stay where it should while resizing?

Thank you. Any feedback is really appreciated!

Brendan

Community feedback

Nick Carlisi• 180

@nickcarlisi

Posted almost 3 years ago

Hi Brendan,

I'm still working on this challenge myself, but regarding your first question, I had a similar issue. Try using percentages instead of rems in transform(translate). Hope that helps.

Marked as helpful

Brendan• 170

@brendanmadden

Posted almost 3 years ago

@nickcarlisi Awesome. Thanks a lot for the tip, Nick! I'll give it a try and keep that in mind moving forward. Good to know. Good luck finishing yours up!

Please log in to post a comment

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