FAQ accordion card | Frontend Mentor | #Day16

This is the 16st frontend mentor challenge we will cover. Today we will convert a FAQ accordion card design to responsive HTML, CSS & JS. 

#thechallenge 

- In this challenge, you'll be building out an FAQ accordion. This is an extremely common front-end pattern, so it's a great opportunity to get some practice in!

#Your users should be able to:

- Hide/Show the answer to a question when the question is clicked

- View the optimal layout for the component depending on their device's screen size

- See hover states for all interactive elements on the page

- Bonus: Complete the challenge without using JavaScript

#link 

- Interactive card details form challenge: https://www.frontendmentor.io/challenges/faq-accordion-card-XlyjD0Oam

- Solution URL: https://github.com/ICode88/FAQ-accordion-card-DAY-16

- Live Site URL:  https://icode88.github.io/FAQ-accordion-card-DAY-16/

👍 Thanks for watching!

Make sure to like + Subscribe For More! ❤

⏱ Timestamps:

00:00 Starting Up

03:26 HTML

10:38 CSS

30:58 Responsive

#socialmedia 

Twitter : https://twitter.com/VlogKomputer

Facebook : https://www.facebook.com/profile.php?id=100092630882001

Linkedin : https://www.linkedin.com/in/vlog-komputer-a8a416275/

Buy Starbucks : https://ko-fi.com/vlogkomputer/goal?g=0

✨Frontend Mentor Challenges Playlist Link:

https://www.youtube.com/playlist?list=PLFW8EFZ2TdT_wT0EV3zKHIZTHvb1yLTiX

https://www.youtube.com/playlist?list=PLFW8EFZ2TdT9Gvc8XSqa1_OQiFIoZR5qP

#frontend #day16 #frontendmentor #challenge #solution #vlogkomputer

Keywords: FAQ accordion card, FAQ accordion card solution, Interactive rating component codepen, frontend mentor challenge, front end mentor, web design challenge