Два текста столбца в HTML не выровнен правильным ⇐ Html

[Anonymous]

Я пытаюсь отформатировать HTML для отформатированного текста в 2 столбцах. Я пытаюсь сделать это следующим образом: < /p>


.content {
column-count: 2;
column-gap: 10px; /* Space between the columns */
}
body {
counter-reset: section;
}
p:before {
counter-increment: section;
content: "" counter(section) ": ";
}< /code>

this is the first paragraph of text.
this is the second paragraph of text.
this is the third paragraph of text.
this is the fourth paragraph of text.
this is the fifth paragraph of text.
this is the sixth paragraph of text.
< /code>
< /div>
< /div>
< /p>
Но когда я открываю этот файл в браузере, я вижу, что текст разбивается в 2 столбцах, но между 2 столбцами не выровнены вертикально (как это видно на скриншоте): .
Что мне нужно сделать - эта строка № 1 в строке № 4 на странице образца будет на той же высоте. Пытался использовать Flex, но это вызывает, чтобы этот текст был разбит более чем на 2 столбца.
Чего не хватает в стиле? Заранее спасибо

Подробнее здесь: https://stackoverflow.com/questions/794 ... ed-correct