Skip to content

[Enhancement][Accessibility]: Horizontal overflow (code blocks) #503

Description

@JC-DSIT

What should change?

Overflowing content

Problem

If a content designer adds a code snippet with a long string without spaces the page is displayed with a horizontal scrollbar

User need

Why is this a problem?

Users will need to scroll in two dimensions to understand the content
Relevant WCAG 2.2 criteria
1.4.10 Reflow (Level AA)

Proposed solution

How could this be improved?

By adding this CSS by default:
code { white-space: pre-wrap; } // OR overflow-x:scroll

Metadata

Metadata

Assignees

No one assigned

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions