CSS Media queries must not lock display orientation

Rule ID: css-orientation-lock
Ruleset: axe-core 4.9
User Impact: Serious
Guidelines: WCAG 2.1 Experimental, EN 301 549
 

Need accessibility training?

Deque University offers an extensive curriculum of self-guided online courses for every skillset and experience level.

Compliance Data & Impact

User Impact

Serious
▼
Minor
Critical

Disabilities Affected

  • Attention Deficit
  • Dyslexia
  • Sighted Keyboard Users
  • Low Vision
  • Mobility
  • Cognitive

Standard(s)

  • WCAG 2.1 Experimental
  • EN 301 549

WCAG Success Criteria [WCAG 2.1 Experimental]

  • 1.3.4: MUST: Orientation

    How to Fix the Problem

    Do not use CSS or other techniques to lock device orientation. Test content orientation views to ensure that content continues to be accessible to all users, including assistive technology users, in any orientation.

    Why it Matters

    Assistive technology users may be unable to access orientation features with their devices or assistive technologies.

    Rule Description

    The screen orientation (e.g. portrait or landscape) of mobile applications should not be locked in one mode. Users should be able to change the orientation of their device between portrait and landscape with the page adjusting accordingly in order to remain understandable. Also, when opening a page, it should display in the user’s current orientation.

    The Algorithm (in simple terms)

    Content does not restrict its view and operation to a single display orientation, such as portrait or landscape, unless a specific display orientation is essential.

    Resources

    Deque University Course Pages (subscription required)

    No related course information available.

    Contribute to axe-core on GitHub

    Refer to the complete list of axe 4.9 rules.

    Was this information helpful?

    You have already given your feedback, thank you..

    Your response was as follows:

    Was this information helpful?
    Date/Time feedback was submitted: