将可变宽度字体更改为固定宽度字体

Question

我有一个asp.net下拉列表控件，其中包含项目名称和价格列表，如下所示

Pen     |  2.09
Book    |   1.2
Handbag | 30.50
Pencil  |  1.05

填充完成后，下拉列表看起来完全对齐，但这仅适用于 font-family：＆＃34; Courier New＆＃34; ，Courier，monospace;
现在整个页面都使用Arial字体，下拉列表需要相同的内容，我该如何实现这一目标呢？ 到目前为止，我已尝试使用jquery包装span标记中的每个字符，如下所示：

var array = $dropdownItem.text().split('');

var result = '<span>' +
              array.join('</span><span>') + 
             '</span>';

$dropdownItem.html(result);​

希望我可以像每个角色一样固定字体宽度，但我不知道如何去做。 提供任何帮助。

Answer 1

最后，我发现除非它是单空间字体，否则不可能使字体以相同的宽度显示。根据定义，单空格字体意味着每个字符具有相等的宽度。