Как выравнить числовые значения в таблице по разделителю?

Question

[Алексей]

Существует возможность выравнить числа по внутри таблицы, в тегах td по точке или запятой?
Например:

----
  153.12
   98.357
  753.00
    0.002
   15
32145.9998

Answer 1

[Ярослав Иванов]

https://jsfiddle.net/space2pacman/fjLpwbap/

Comments

[Ярослав Иванов]

Алексей а чем мой вариант плох?)

[Алексей]

Ярослав Иванов, Отметить не жалко :)
Но вариант лично для меня плох тем, что у меня таблица имеет фильтры и сортировку по колонкам средствами JS без перегрузки страницы. Естественно для сортировки и фильтрации работа ведется с данными заключенными в теги td. А в данном случае придется придумывать как это сделать используя данные в трех ячейках таблицы.

[Ярослав Иванов]

Алексей, Этого в вопросе не было)) я думал, что надо лишь расположить контент таким образом)

[Алексей]

Ярослав Иванов, Дело в том, что вообще в верстке почти ноль, плохо знаю css. Программировать куда легче, чем возиться с пикселями :) я просто думал что мне типа скажут мол text-align:dot; и нет проблем. Оказалось не всё так просто.
У меня просто данных в бекэнде большое количество, и данные разношерстные без возможности привести к единому виду. Выравнивал по левому краю, выравнивал по центру, по правому краю, понял, что всё выглядит плохо. Было бы хорошо выравнивать по точке, а как это сделать не знаю.

Answer 2

[0xD34F]

Вижу два варианта:

1. Разделить колонку на три - в первой отображать целую часть, во второй разделитель, в третьей дробную часть. Первая колонка выравнивается по правой стороне, третья по левой.

2. Задать моноширинный шрифт и добавить пробелов слева.

Answer 3

[Exploding]

В одну колонку без пробелов))

Comments

[Алексей]

Спасибо! Вполне рабочий вариант.
Жаль, что только выделять и копировать цифры не получается.

[Exploding]

Алексей, Можно при hover прятать after и before и показывать span выравнивая по левому или правому краю с transition. Потыкать надо, по идее может получиться вполне юзабельный вариант