我试图在选择下拉列表中的每个选项元素中均匀地间隔多个字符串，以创建每个字符串像每个选项中的列一样显示的外观。这就是我试图完成的（显示的是WPF选择）：

的数据
您可以在左侧看到文本，在最右侧看到数字值，无论左侧文本的长度如何。
我的看起来像这样：

的
我的不需要最右边的数字，我只希望每个选项在两个属性之间有空间，就像它们在列中一样。因为在样式化HTML选择选项方面几乎没有可用的，所以我的想法是计算左侧字符串的长度，并根据该长度插入一些空格，以尝试均匀地间隔左侧字符串和右侧小数。
我的option元素Razor代码如下所示：

@foreach (var component in components)
{
    <option>
        @component.Description
        @for (int i = 0; i < (12 - component.Description.Length); i++)
        {
            <p>&nbsp;</p>
        }
        @component.DecimalValue
    </option>
}

字符串
据我所知，这不起作用，因为字母的宽度不同，插入的空格数并不代表这一点。
有没有一种算法可以根据字母的长度和宽度插入空格，或者有没有一种替代方法可以在选项元素中均匀地间隔这两个属性，比如使用CSS？