Не знаю, как лучше это объяснить, но я столкнулся с этой проблемой дважды.
Если я хочу разместить изображения в виде таблицы, символ 
‘|’ в изображениях всегда мешает.
Вот что происходит: вы используете \|? Символ «pipe» является частью структуры таблицы, и он точно не работает как часть содержимого внутри ячеек, поэтому я почти уверен, что его необходимо экранировать.
Тогда мы рассматриваем вариант 2: HTML-таблицы.
Не могли бы вы подробнее рассказать, как это работает? Я не вижу код для таблицы.
Конечно, вот исходный текст:
|A|B|
|-|-|
|
||
Спасибо, что поделились. Я попробую.