function created with JQuery

Community feedback

• 

  Ken•935

  @kenreibman

  Posted about 3 years ago

  Great job! I like your use of jQuery on the accordion.

  Initially your design looks great, but your entire card starts to fall apart when the viewport width starts to get smaller. I have a few suggestions...

  • I believe you are having these issues because you are giving your containers a fixed width and height. Giving fixed dimensions like that lead to lots of responsiveness issues. Instead I would start using max-width, and use rem units instead of vh and vw for setting container dimensions.
  • I also highly advise you against declaring a set height, and let your content expand on its own. Very rarely do I set a specific height for certain containers in my projects. This relates back to your parent element, which is your body tag in this case. I would set a min-height: 100vh to make it more responsive.
  • You might also want to look at your media query breakpoints again, as there is a gap between your desktop to mobile layout where it completely breaks the entire website.

  I actually recommend you to take a look at a video of someone completing this challenge on Youtube, or look at my code for the same problem

  I hope this helps and keep learning!

  01

  Marked as helpful