diff --git a/CHANGELOG.md b/CHANGELOG.md index ab2df472492..89c30331693 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,8 @@ ## [`master`](https://github.com/elastic/eui/tree/master) -No public interface changes since `37.6.0`. +**Bug fixes** + +- Fixed `EuiScreenReaderOnly` positioning issues within scrolling containers ([#5130](https://github.com/elastic/eui/pull/5130)) ## [`37.6.0`](https://github.com/elastic/eui/tree/v37.6.0) diff --git a/src/global_styling/mixins/_helpers.scss b/src/global_styling/mixins/_helpers.scss index 9527f83f142..6cf16499b54 100644 --- a/src/global_styling/mixins/_helpers.scss +++ b/src/global_styling/mixins/_helpers.scss @@ -106,10 +106,15 @@ } // Hiding elements offscreen to only be read by screen reader +// NOTE: Hidden absolute positioning can cause issues with scrolling/overflow. +// `clip` and `left` (for Chromium browsers) are needed to prevent these issues - +// @see https://github.com/elastic/eui/pull/5130 for more info @mixin euiScreenReaderOnly { position: absolute; left: -10000px; top: auto; + clip: rect(0 0 0 0); + clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden;