translate

Featured Links

Questions & Answers

This listing is a compilation of both questions asked in-site and questions related to accessibility themes gathered from different sources (stackoverflow, UX Stack Exchange).

Displaying 1 - 20 of 37 questions

Edge :focus styles

Stackoverflow

Trying to get the pseudo class :focus to work in Edge. This is working in Chrome and Firefox, but for ADA reasons, need it to work in Edge.

Tags: 
  • jquery
  • css
  • internet-explorer
  • sass
  • accessibility

accessibility for empty table cells

Stackoverflow

We are using axe to test accessibility.

Axe is giving the following issue when table cells are empty:

Tags: 
  • html
  • css
  • reactjs
  • accessibility

How to hide CSS generated content from screen readers without HTML markup?

Stackoverflow

How would one hide CSS certain generated content (used for pure styling) from screen reader? Is it possible without using HTML hacks like aria-hidden?

Tags: 
  • html
  • css
  • accessibility

What is causing this accordion nav to lose browser default focus?

Stackoverflow

What is causing this accordion nav to lose browser default focus?

Tags: 
  • html
  • css
  • twitter-bootstrap
  • accessibility

High Contrast and CSS sprites

Stackoverflow

I'm working on a project that it has to be accessible to everyone and I have some problems when the PC is in High Contrast mode.

Tags: 
  • css
  • user-interface
  • firefox
  • accessibility
  • opera

Substitute symbol for text in table cells and maintain center alignment

Stackoverflow

I've got a table showing participation of countries in a project in 2013 and 2018. For a year in which a country participated, we want to display a black circle.

Tags: 
  • css
  • html-table
  • accessibility
  • substitution

Can I conditionally adjust list item height in React Native based on a user's accessibility setting?

I'm working on a React Native app that uses FlatList to render rows of data. Each row contains an icon on the left and an item title and description on the right.

Tags: 
  • javascript
  • css
  • layout
  • react-native
  • accessibility

How do I make a screenshot image accessible?

I'm trying to make my website fully accessible for devices like screen readers. In one page on my site, I have a screenshot of an application showing a lot of text.

Tags: 
  • html
  • css
  • accessibility
  • wai-aria

Blinking text for screen reader

I am now making my website readable by screen readers.

Tags: 
  • javascript
  • html
  • css
  • accessibility

How to tag an element below form elements so that the screen reader picks it up

Say I have a div with some p tags below some text elements, how do I aria tag these so the screen reader picks these up?

I could give the div tagindex="0" but my linter complains:

Tags: 
  • html
  • css
  • accessibility

hide a pseudo-element from a screenreader?

Stackoverflow

I am using :before pseudo-elements bound to particular classes to add symbols in front of p tags, with CSS like this:

Tags: 
  • css
  • accessibility
  • pseudo-element
  • screen-readers

How to display a list of links as a drop down select?

Stackoverflow

I want to display a list of links like a drop down select, without losing the semantic if possible. Here's what I tried. The CSS obviously does not work now.

Tags: 
  • javascript
  • html
  • css
  • accessibility
  • semantic-markup

IE issue: wrong tab focus

Stackoverflow

I have a link at the very top of the page called "Skip Navigation", that appears on the screen every time user presses Tab, and if he presses Enter while "Skip Navigation" is in focus, it takes him

Tags: 
  • javascript
  • html
  • css
  • internet-explorer
  • accessibility

Remove styles from open SELECT elements in Chrome?

The current stable version of Chrome (v61) exhibits some undesirable behaviour with styled select elements.

Tags: 
  • css
  • forms
  • google-chrome
  • accessibility
  • usability

making focus invisible for radio buttons on click but focus should be visible on keyboard navigation

How do I make focus invisible for radio buttons only on click (focus should be visible through keyboard navigation)

Tags: 
  • javascript
  • jquery
  • css
  • angular
  • accessibility

Is it important to have relative units to ensure Section 508 / WCAG 2.0 Level AA compatibility?

I have all my font sizes defined in pixels, e.g.

body {
font-size: 14px;
}
h1 {
font-size: 42px;
}

Tags: 
  • html
  • css
  • accessibility
  • section508
  • wcag2.0

All content with position: relative is hidden once button has focus in overflow-y:auto parent container

I am creating an accessible chat window for use in a project. The buttons must be focusable to perform actions on each message.

Tags: 
  • html
  • css
  • focus
  • overflow
  • accessibility

How to "disable" a radio button in a way that a screen reader would still read the text and indicate to a user that it is disabled?

I have a use case where I want to disable some radio buttons, but there are ways to go back an re-enable this radio buttons.

Tags: 
  • javascript
  • html
  • css
  • accessibility

Need a CSS fix for tabbing

I'm working on some code that needs specific accessibility features. I created a js fiddle for reference to illustrate my issue.

Tags: 
  • css
  • css-selectors
  • accessibility
  • tabbing