Как я могу разместить + в местах пересечения границ, как показано в приложениях терминала? ⇐ CSS

[Anonymous]

Я пытаюсь отобразить таблицу так же, как она отображается в терминальной программе:

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

body {
width: 100%;
font-family: "Fira Code", "Consolas", "Courier New", monospace;
}

table {
border-right: 1px dashed;
border-collapse: collapse;
}

td,th {
border: 1px dashed;
}

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

Pen





Col1
Col2




Col1
Col2




Col1
Col2

Обычно таблицы в программе cli/terminal отображаются следующим образом:

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

+----------+---------+-----------+
| col1     | col2    | col3      |
+----------+---------+-----------+
| v1       | 3.0.0   |         1 |
| v2       | 1.0.2   |         1 |
| v3       | 1.0     |         1 |
| v4       | 3.3.1   |         1 |
+----------+---------+-----------+

Как разместить символ + в месте пересечения границ? Я хочу использовать CSS, если это возможно, вместо JS.
Как видите, мне удалось просто разместить пунктирную рамку, знаете ли вы, как это сделать?

Подробнее: https://stackoverflow.com/questions/799 ... terminal-a