Overflow bug with .visually-hidden class

This article details a bug discovered in Chrome and Webkit browsers where using the .visually-hidden class inside an element with overflow set to scroll, auto, clip, or hidden creates unwanted gaps at the end of the overflow container. The issue compounds with multiple visually-hidden elements. The author explains the purpose of the .visually-hidden class for accessible screen reader content, demonstrates the bug with examples, and provides a simple fix: adding position: relative to the overflow element. This is a technical web development tutorial relevant to front-end developers and accessibility practices.