Skip to content
Submitted about 2 years ago

FAQ Accordion Card with HTML, CSS, Bootstrap 5.2

Giorgi•200
@siduki
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...FAQ accordion card
  • HTML
  • CSS
  • JS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Hello everyone

I have solution for this challenge, but it's not fully done, have two task.

  1. Overflow of box image, how can I resolve it, I can't find solution.
  2. Accordions arrow icons showing on Firefox and don't on Chrome, can't resolve.

If you have some solution or advices, please don't hesitate.

Community feedback

  • Tien•210
    @NN-NT-TNPosted about 2 years ago

    .accordion-button.collapsed::after { background-image: url(../Images/icon-arrow-down.svg); this should be "background-image: url(../images/icon-arrow-down.svg"); background-size: 100%; width: 12px; } make sure the links are correct yes whether the letter capitalize or not I guess Firefox don't care about capitalization .

    Marked as helpful
    0
    Giorgi•200
    @sidukiPosted about 2 years ago

    @NN-NT-TN Hello

    I changed it and it works locally, I already uploaded changed code and let's see, it needs few minutes for activate on pages. I don't know, why I had there uppercase "I", and also, I don't knew about this difference between Chrome and Firefox.

    Thank you for your help.

    0
    Giorgi•200
    @sidukiPosted about 2 years ago

    @NN-NT-TN Hello

    I changed it and it works locally, I already uploaded changed code and let's see, it needs few minutes for activate on pages. I don't know, why I had there uppercase "I", and also, I don't knew about this difference between Chrome and Firefox.

    Thank you for your help.

    1

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord