The hidden-accessible class has the unique ability to mimic the effects of display: none, yet still be accessible to screen readers and possess the correct metrics. This is useful for retrieving the width and height of an element in JavaScript without it being visible or taking space in the layout.

hidden-accessible.css

.hidden-accessible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}