Я пытаюсь создать свой первый отзывчивый макет. Я хочу отображать элементы списка в вертикальной линии, в зависимости от ширины.
<div style="height:800px;">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
</ul>
</div>
1 5 2 6 3 7 4
Если размер браузера изменяется, я хочу, чтобы он стал
1 4 7 2 5 3 6
Может кто-нибудь мне помочь? Я пытался часами, и я ничего не могу получить. Я пробовал использовать таблицы, но я тоже не могу сделать это.