Skip to content
Submitted over 3 years ago

FAQ Accordion card

Jan Blahout•70
@JanBlahout
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...FAQ accordion card
  • HTML
  • CSS
  • JS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Hi,

I think the design looks good overall but I have one issue. When I switch to mobile view (iPhone X) and I click one respective link, it doesnt color the text correctly. Any ideas how to fix it ?

Also - I have tried making the text appear as a transition but I wasnt able to do it with transition all 0.3s or opacity 0 -> Opacity 1. Any tips how to do this please?

The last question would be, how to make the text more static, so it doesnt jump around when opening and closing the questions.

Thank you very much for all your feedback,

Jan

Please log in to post a comment

Log in with GitHub

Community feedback

  • Paras Sharma•700
    @imparassharma

    For making the text static you have to define the height of the container. You have also used justify-content so every time answer shows up the container adjusts its position automatically so don't use that.

    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