Skip to toolbar

Community & Business Groups

Flexbox Tests – test cases for CSS Accessibility Community Group

I don’t know if it is all right, to make a fresh post … 🙂

A little late but finally ready: test cases for CSS flex box layout and its accessibility issues.

http://sprungmarker.de/wp-content/uploads/css-a11y-group/css-a11y-flexbox.html

As expected flex box possibilities to change content order is critical to keyboard users.

All browser and screen reader use for keyboard use source code order and not visual content order generated with CSS.

This can be quite confusing and depends on use case of reordering content. At worst it can be more like a zigzag on the page.

Only current Firefox is using visual order in old flex box specification and ordinal-group.

New spec is hard to test because only chrome is supporting it. Internet Explorer 10 and some versions of Webkit nightly do too. So I have to keep an eye on development and update test cases when browser get more along with the new spec.

Also we have to consider that browser and screen reader might adapt on visual content flux with flex box. No one knows.

I will keep test case updated.

Sylvia

Update:

I have updated the test cases to the new standard spec of flex box. Tests are now also on documented for mobile – iOS and Android. And as for today for IE 11, which is supporting new standard spec out of the box.

 

3 Responses to Flexbox Tests – test cases for CSS Accessibility Community Group

  • Wonderful! Wonderful! I love you Sylvia! This is exactly the kind of thing we need. That’s just gorgeous.

    This weekend I’m attending the testthewebforward.org event in San Francisco. Read about this – it’s important if folks have not already see it.

    I will report back about how the W3C wants to make use of our community work with test cases – note that the majority of folks involved in the event are from SVG and CSS Working Groups. Truly exciting.

    So I shall keep you posted!

    Mols

    Reply

  • “New spec is hard to test because only chrome is supporting it. Internet Explorer 10 and some versions of Webkit nightly do too.”

    Just a note to say that Opera (pre switching to Blink) also supports the new Flexbox, and it is unprefixed.

    IE 10 does *not* support the new flexbox, but it is a fairly close version. The spec was changed after implementation. Some properties are the same, while some are different. There are some changes other than syntax, such as flex property now being a shorthand. IE11 will almost certainly use the new flexbox without prefix (Guess we’ll find out on Wednesday)

    Firefox also supports the new spec, but behind a runtime flag. It should be landing, enabled by default, soon.

    Reply

  • Test cases are now up to date – also I made tests today with IE 11 beta.

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

Before you comment here, note that this forum is moderated and your IP address is sent to Akismet, the plugin we use to mitigate spam comments.

*