question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

WCAG 2.1 1.4.12 Text spacing in the Switcher

See original GitHub issue

Describe the bug

The switcher to change from fastpass to assessment has overlapping text

To Reproduce

  1. Go to text legibility> text spacing
  2. run the following function (Same as the bookmarklet) (function () { document.querySelector("body").classList.add("text-spacing"); var style = document.createElement("style"), styleContent = document.createTextNode(".text-spacing * { line-height: 1.5 !important; letter-spacing: 0.12em !important; word-spacing: 0.16em !important; } .text-spacing p{ margin-bottom: 2em !important; } "); style.appendChild(styleContent); var caput = document.getElementsByTagName("head"); caput[0].appendChild(style); })();
  3. check the switcher

Expected behavior

all text is visible

Screenshots

Switcher with overlapping text

Extension (please complete the following information)

  • OS: [e.g. Windows/Mac] Windows
  • Version [e.g. 1.140.1] 2.9.1
  • Browser Version [e.g Chrome 71.0] 75
  • Target Page [e.g www.bing.com] any

Are you willing to submit a PR?

No

Did you search for similar existing issues?

Yes

Additional context

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:16 (13 by maintainers)

github_iconTop GitHub Comments

1reaction
AhmedAbdoOrtigacommented, Sep 10, 2019

Worked with @peterdur, we were able to repro it by running the code in the DevTool console

0reactions
ferBonnincommented, Dec 4, 2019

Hi, I was wondering if you would like me to create a new separate issue regarding the drop down box moving outside the header?

yes, please!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Understanding Success Criterion 1.4.12: Text Spacing | WAI
Line height (line spacing) to at least 1.5 times the font size; Spacing following paragraphs to at least 2 times the font size;...
Read more >
1.4.12 Text Spacing | New Success Criteria in WCAG 2.1
This success criterion allows users to use custom CSS to add additional spacing to the text that they see, without losing parts of...
Read more >
1.4.12 Text Spacing - Maxability
12 text spacing ensures that the users may want to use user defined style sheets, browser plug-ins or bookmarklets to increase the space...
Read more >
WCAG 2.1 Article 1.4.12 - YouTube
These styles are line height, or line spacing, to at least 1.5 times the current font size. Spacing following paragraphs to at least...
Read more >
1.4.12 Text Spacing - Web Accessibility Requirements
1.4.12 Text Spacing · Line height (line spacing) to at least 1.5 times the font size; · Spacing following paragraphs to at least...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found