Forums

This topic contains 2 replies, has 0 voices, and was last updated by  dougoftheabaci 6 years, 2 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #40881

    I’ve started rolling out icon fonts on the site I work for, but there’s a problem: I need IE7 support. Were it up to me we’d accept the visual loss for IE7 users. However, it’s not and word has come down from on high that IE7 users need to see icons.

    This leads me to one issue: How do I stop screen readers from reading out text? In order to get them to show in IE7 I need to actually have them in the markup. Which is kind of annoying as a link that looks like a settings cog and says “Settings” will be read as “S Settings”. Small thing but annoying.

    Since I can’t use pseudo-elements like :before and :after, is there a way I can make screen readers ignore the S (which will be in a SPAN tag)?

    [solution:]

    Using `aria-hidden=”true”` with `speak:none;` in the CSS gets me 99% of the way there. Is it perfect? No, but until I can drop IE7 I don’t think that’s going to happen.

    #114865

    Paulie_D
    Moderator

    aria-hidden

    would be one way but I’m unsure about IE7 support.

    http://css-tricks.com/html-for-icon-font-usage/

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

icon-link icon-logo-star icon-search icon-star