outline focus for accordion titles

  • Resolved pchadwick

    (@pchadwick)


    1 year, 12 months ago

    I would like to add an outline focus for the accordion titles when someone is tabbing through the page for accessibility. I’ve tried adding custom CSS to the page using various classes I see when I inspect the code but nothing works so far. Here is what I currently have:

    .ea-header:focus {
    outline: #46790 solid 1px; }

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Support Pulak Ahmed

    (@pulak00)

    Hi @pchadwick,

    Thanks for reaching us. Hope you are doing great today!

    On your CSS, we can see that you have added the property in the wrong way. The hexa-color-code must consist of six digits number. You can modify the code in the following format. 

    outline: 1px solid #467903;

    Hopefully, it will work. If that doesn’t we request you to share a sample of the style you want to implement. We will provide the necessary codes to implement it.

    Thank you!

    Thread Starter pchadwick

    (@pchadwick)

    Thank you. I think the problem was that I didn’t have the right class. This CSS worked:

    .sp-easy-accordion a:focus {
    outline: 2px solid #467906;
    }

    Plugin Support Pulak Ahmed

    (@pulak00)

    Hi @pchadwick,

    It’s great to know that you were able to adjust the CSS code.

    If you are happy with the plugin and the support, you can share your experience here.

    We will highly appreciate that.

    Have a great day!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘outline focus for accordion titles’ is closed to new replies.