FAQ accordion card - Js, Sass, Mobile first

Community feedback

• 

  T

  Grace•30,990

  @grace-snowPosted over 3 years ago

  Hello

  Content needs to be a string that's why it doesn't show up I expect, missing quote marks. I would give the pseudo empty content: "" a width and height or 1em and display block.

  The other thing I recommend as essential is changing faq-accordion_question-title element to be a button not a paragraph. Then you get keyboard accessibility for free ☺ Always use interactive elements for interactive behaviour

  Good luck

  Marked as helpful

  1

  ---

  

  P

  Joel•290

  @joelsalmeidaPosted over 3 years ago

  @grace-snow Hello Grace. Excellent feedback as always.

  I did some research on the behavior of :before and tried a solution with DATA-URI.

  But I still don't know if it worked. "Github Pages hasn't updated my page yet." Let's see what happens.

  Anyway, thank you very much.

  0

  

  T

  Grace•30,990

  @grace-snowPosted over 3 years ago

  I meant to add to my suggestion if you change those properties you can use background img. Whoops sorry missed that bit in the message!

  Here is some more info https://css-tricks.com/html5-progress-element/

  Using background img is usually best because it gives easy control over the size of the icon

  0

  

  P

  Joel•290

  @joelsalmeidaPosted over 3 years ago

  @grace-snow Interesting article. I tried a more radical solution, thank god it worked. haha

  For some strange reason, Github Pages wasn't updating my code, it got in the way a bit too.

  I changed from p to button tag, as you said, and I liked the final result.

  Thanks. Keep coding. ;)

  0