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

Faq Accordion Card/ HTML5/ CSS3/JAVASCRIPT

Yohan Reyes• 300

@Yohanr19

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


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

@karenefereyan

Posted

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

0
shashank• 225

@shashankrk46

Posted

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

0

Yohan Reyes• 300

@Yohanr19

Posted

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

0
P
Patrick• 14,325

@palgramming

Posted

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

@Yohanr19

Posted

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
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