• Resolved downtonpcweb

    (@downtonpcweb)


    Hi, in trying to update the website to comply with WCAG AA 2.1 I seem to have hit an issue with a piece of styling associated with the H2 Screen-reader-text for the Footer menu.

    It appears that actual text “Footer Menu” has no style associated with it. In the Chrome Inspector it just appears as “Footer Menu” with a white text. The background is set but I can find no style to set the font color to black to increase its contrast!.

    Any ideas appreciated.

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

Viewing 2 replies - 1 through 2 (of 2 total)
  • Hi @downtonpcweb ,

    When you say you can find no style to set the font color to black, do you mean a setting in the customizer?

    If yes, you can change it’s color from Appearance -> Customize -> Footer -> Colors and Background -> Text Color

    However, this will also change the color of your copyright icon and year to the selected color.

    So, you can add custom CSS instead for screen reader text as follows:
    h2.screen-reader-text {
    color: black;
    }

    Thread Starter downtonpcweb

    (@downtonpcweb)

    Hi prajakti,

    I tried the Customise options

    Appearance -> Customize -> Footer -> Colors and Background -> Text Color

    which worked great – I needed to set all fonts to black so as to increase the contrast.

    Many thanks for a prompt response.

    Paul

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Screen Reader Text – H2 Footer Menu’ is closed to new replies.