Outline on focus

  • Resolved morriscountynj

    (@morriscountynj)


    6 years, 11 months ago

    I’m working on accessibility fixes for various websites, and noticed that on focus, the Tabby tabs do not display an outline, like is the default for links. I’d like focus: outline to apply to my Tabby tabs. If you tab through the page, you can see everything gets a visual indicator EXCEPT the tabby tabs.

    I’ve tried via CSS but nothing seems to be working for me. Is this something you could possibly implement for accessibility? Or provide some code so I can do it?

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

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author cubecolour

    (@numeeja)

    Try using some CSS similar to:

    
.responsive-tabs__list__item:focus,
.tabtitle:focus{
	outline: 2px dotted red!important;
}

    It should be possible to add specificity to the selectors instead of using the important declaration.

    Thread Starter morriscountynj

    (@morriscountynj)

    I tried via specificity a few times, but nothing seemed to work. The important! declaration did do the trick, however, thank you!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Outline on focus’ is closed to new replies.