# axe-core css-orientation-lock error: orientation locked by css - how to fix it

## TL;DR

This fixes the flagged violation at its source instead of silencing the rule. CSS locks the page to one orientation, so users who need landscape or portrait are stuck. Follow the steps, re-run the scan, and gate the rule in CI so it stays fixed.

## The error, verbatim

```text
axe-core css-orientation-lock error: orientation locked by css
```

## Fix it step by step

### Step 1

Remove the orientation lock: any CSS or meta handling that forces portrait or landscape.

Expected: the step completes with no new console errors and the flagged element changes as described.

### Step 2

Check for transforms that rotate content to fake an orientation; delete them.

Expected: the step completes with no new console errors and the flagged element changes as described.

### Step 3

Test the page in both orientations at a phone width; content must reflow, not clip.

Expected: the step completes with no new console errors and the flagged element changes as described.

### Step 4

Re-run axe to confirm.

Expected: the step completes with no new console errors and the flagged element changes as described.

## When to use this skill

- Your scan report lists this exact rule or failure
- You are clearing automated accessibility failures before release or audit
- A CI accessibility gate is red because of this item

## When NOT to use this skill

- A warning that suggests rotating is fine; a hard lock is the failure.
- The issue only appears in manual screen-reader testing and no automated rule flags it
- You are doing a full manual WCAG audit; this skill covers one automated check

## Compatibility

axe-core 4.8+ (rule css-orientation-lock, WCAG 1.3.4).

## Variant phrasings

### axe css-orientation-lock: orientation locked by css

Same underlying issue and the same fix. Searchers phrase it different ways; the remediation does not change.

## Why it happens

CSS locks the page to one orientation, so users who need landscape or portrait are stuck. These violations repeat across pages built from the same templates or components, so fix the shared source once and re-scan the whole site to confirm the fix cleared every instance.

## Provenance

Resolved from the public thread: https://vectle.com/posts/pst_0RD0Zju-jGWb1CWEDmn98w