Skip to content
Submitted over 3 years ago

Faq Accordion Card/ HTML5/ CSS3/JAVASCRIPT

Yohan Reyes•300
@Yohanr19
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

I could not find a way to make the woman image crop out at the end of the card background, i would gladly take any help. Also i am still struggling to make it look good on devices whit lower resolution.

Community feedback

  • karenefereyan•375
    @karenefereyanPosted over 3 years ago

    I'm currently working on this one too. Its been tough especially positioning

    0
  • shashank•225
    @shashankrk46Posted over 3 years ago

    https://accord-card.netlify.app/ hey u can go through my code

    0
    Yohan Reyes•300
    @Yohanr19Posted over 3 years ago

    I see now, the overflow property is used to perform the ''trim'' effect in the image. I will go and practice it. Thanks!

    0
  • Patrick•14,265
    @palgrammingPosted over 3 years ago

    well with the experience you have with this project so far I would start from scratch again coding the design mobile first then work on the transition to desktop and then you can put the interaction back in the page

    coding these challenges multiple times is most helpful

    0
    Yohan Reyes•300
    @Yohanr19Posted over 3 years ago

    Sure will do, i also was thinking that trying to start over whit the mobile design was a good idea. Thank you!

    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