Как скрыть элемент без display: none
Смысл в том, чтобы спрятать элемент, сохранив к нему доступ.
Иногда нужно сделать элемент невидимым. display: none
в таком случае кажется самым простым решением, однако, это плохой путь — скрытый через свойство display
объект становится невидимым не только для глаз, но и для любых других инструментов — его нельзя выбрать при помощи клавиатуры, его не увидит скринридер.
Если это не является целью, то есть иной путь.
.is-hidden {
border: 0;
clip: rect(0 0 0 0);
clip-path: inset(50%);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
white-space: nowrap;
}
Этот способ я подсмотрел в докладе Анны Селезнёвой «Знакомьтесь, модальное окно».