У меня есть страница с двумя элементами, содержащая навигационные ссылки. Используя медиа-запросы, я отображаю один или другой в зависимости от ширины экрана.
Итак, на рабочем столе отображается широкая навигация, а мобильная навигация имеет «display: none». На мобильном телефоне все наоборот.
Однако, когда вы приходите на рабочий стол, вы нажимаете клавишу [tab], чтобы переключаться между элементами на экране.
Проблема заключается в том, что, несмотря на то, что ни один не отображался; ссылки в скрытой мобильной навигации становятся все более популярными. Кольцо фокусировки исчезает, когда вы находитесь в этой части дерева вкладок.
Я использую медиазапрос в CSS, я не хочу помещать в них tabindex = -1, потому что я хочу сохранить дерево вкладок (мобильная навигация прекрасно работает для узких окон браузера).
Что я могу сделать?