Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • December 10, 2021 at 9:25 am #1332251
    sky19er

    I added the following code to improve accessibility on https://lunchticket.org/, but I can’t get an outline to show on the header logo — do you know how I might get that to show? Thanks!

    a:focus-visible {
  outline: 3px #000 solid;
}
    December 10, 2021 at 10:16 am #1332260
    Guenni007

    it is because of this rule from layout.css –
    outline is as the name indicates outside the container.

    .logo, .logo a {
  overflow: hidden;
  position: relative;
  display: block;
  height: 100%;
}

    change the overflow to visible
    btw. did you test the One Click Accessibility Plugin. Enfold supports it by default.

    December 10, 2021 at 11:51 am #1332286
    Rikard

    Hi,

    Thanks for helping out @guenni007 :-)

    Best regards,
    Rikard

    December 15, 2021 at 8:12 pm #1333023
    sky19er

    Ah, sweet, thank you! I had tried that, but only with .logo a — I missed just the .logo — now that I’ve added the .logo it works! Thanks again!

    December 16, 2021 at 9:47 am #1333062
    Rikard

    Hi,

    Great, I’m glad that you got things working. Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

    December 17, 2021 at 12:54 am #1333184
    sky19er

    All good and free to close — thanks again.

    December 17, 2021 at 9:07 am #1333227
    Rikard

    Hi,

    Thanks for letting us know, I’ll close this thread for now then. Please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘a:focus-visible on logo’ is closed to new replies.