Есть ли способ заставить порядок табуляции соблюдать визуальный порядок? ⇐ Html

[Anonymous]

Предположим, у меня есть веб-страница, содержащая список ссылок.

Код: Выделить всё

[list]
[*][url=#]Alpha[/url]
[*][url=#]Bravo[/url]
[*][url=#]Charlie[/url]
[/list]

Из соображений дизайна мне нужно изменить порядок этих ссылок на больших экранах, чтобы «Альфа» визуально находилась внизу списка.

Код: Выделить всё

@media (min-width: 30em) {

.links {
display: flex;
flex-direction: column;
}

.links > li:first-child {
order: 1;
}

}

При переходе по различным фокусируемым элементам на странице визуальный порядок этих ссылок не учитывается, поэтому при переходе по списку порядок фокуса будет следующим: «Альфа», затем «Браво», затем «Чарли».

Если я устанавливаю положительный tabindex для любой из этих ссылок, они перемещаются в конец порядка табуляции (поскольку все остальные элементы, доступные для фокусировки, по сути, имеют индекс табуляции из 0).

Мой вопрос: есть ли способ заставить порядок табуляции соответствовать визуальному порядку?.

Подробнее здесь: https://stackoverflow.com/questions/534 ... sual-order