• Success Criterion 1.3.4
  • Conformance level AA

Critical Controls Cropped or Unusable in One Orientation

1.3.4 — Orientation

Scenario

Setting

A music streaming app's playlist screen

What’s wrong

Critical controls unusable/cropped in one orientation with no scroll path.

Example 

.playlist-toolbar {
  position: fixed;
  bottom: 0;
  height: 100vh;
  overflow: hidden;
}

Why it matters

A user browsing in landscape can see their playlist, but the buttons needed to save it or add songs are cropped off-screen with no scroll path to reach them.

How to test

Rotate the device and check critical controls: if they become cropped, overlapping, or otherwise unusable in one orientation with no scroll path to reach them, it fails.

How to fix

Let containers grow and scroll naturally instead of clipping content with a fixed height in either orientation.

.playlist-toolbar {
  position: relative;
  height: auto;
  overflow-y: auto;
}

Outcome

A landscape user can now scroll down and reach Save Playlist without switching orientation.

Who is affected

Landscape-mounted device users and anyone who rotates for a wider view lose access to essential playlist controls entirely.

Learn more

Related scenarios