FAQ Accordion Card

Community feedback

• 

  Андрій Рогов•1,155

  @Andrii-RohovPosted over 3 years ago

  Hi, great solution. You can try to improve it by adding (cursor: pointer;) to all buttons. Also, when you hover over buttons, the text should be orange, try to add button:hover { color: #f47b56; }

  Marked as helpful

  1

  ---

  

  Андрій Рогов•1,155

  @Andrii-RohovPosted over 3 years ago

  also, whole card should have some box-shadow

  0

  

  Carol•30

  @carolandrade1Posted over 3 years ago

  @Andrii-Rohov thank you for point that! I forgot to add this styles, but I am going to change that.

  0

  

  Андрій Рогов•1,155

  @Andrii-RohovPosted over 3 years ago

  @carolandrade1 you're welcome)

  1
• 

  Faris P•2,810

  @FarisPalayiPosted over 3 years ago

  Yeah, since your card doesn't have a fixed height, after you open a few questions, the card's size increases. And since your background image have a align-items: center; it'll try to make the image in the middle of the card (based on the card's height). So yeah, that's why the image moves.

  If you don't want the image to move, then on the .card__image you can set align-items value to flex-start and give it a margin-top.(There are a lot of other ways you could achieve the same result, I just said to you something that popped into my mind right now). Hope it all makes sense.

  And also your solution looks excellent, responds nicely. Well done tackling this challenge 👏

  Marked as helpful

  1

  ---

  

  Carol•30

  @carolandrade1Posted over 3 years ago

  @FarisPalayi thank you for the tips!

  1