Mobile first using only HTML and CSS [!JavaScript]

Community feedback

• 

  Ahmed Faisal•5,095

  @afrusselPosted about 3 years ago

  Wow 👏 great work. So close to design. Found some issue on JavaScript. All option can open at a time. Please check accordion option

  2

  ---

  

  KT•390

  @KtGitItPosted about 3 years ago

  @afrussel Thanks for feedback. Javascript is not used at all for this. I tried to accomplish bonus point in challenge that stats the complete without using javascript. I am planning on doing it with javascript as well.

  0
• 

  John_diddles•470

  @JohndiddlesPosted about 3 years ago

  wow, this is really nice! One issue I noticed is that the height of the container changes when you open an accordion. Also when all accordions are open, I noticed that the bottom border of the last accordion cuts through the text in the footer. Not withstanding, you've done a great job.

  I have done this challenge before. You can view it here https://johndiddles.github.io/faq-accordion-page Your comments are welcome

  1

  ---

  

  KT•390

  @KtGitItPosted about 3 years ago

  @Johndiddles This is great feedback. I fixed the footer issue. Regarding the change of height when accordion opens, I looked at your solution and you have same issue on mobile layout but not on desktop, but on desktop when all are open, top and bottom are almost touching to the container wipes out all the margin. Maybe design is meant not to have open all accordion at the same time. One opens and the other one closes at the same time. May be it is possible with JS. I haven't use any JS on this but planning on working on one with JS and I think that would fix height change issue. BTW, great job on your solution and animation looks great as well

  0
• 

  Lincoln Dube•85

  @slickLinkPosted about 3 years ago

  Wow just wow, I love your solution, I had never heard of html details tag before i came across your solution. I finished mine using :target but I couldn't get it to close after it was open unless you opened a new question. Honestly I can't give feedback to you but just wanted to say great job, I learned a lot from you solution, will definitely try using some in later challenges.

  0

  ---

  

  KT•390

  @KtGitItPosted about 3 years ago

  @slickLink Thank you for your feedback and I am glad that my solution was helpful.

  0