Css 如何对齐自定义计数器列表？

此HTML列表（已订购但我的特殊订单）

显示列表，但我看不到如何像通常的列表一样对齐“数字”。

---

请参见默认列表中处的点对齐问题。数字位于

ul/ol

s填充中

你可以像这样把圣路易斯变成这样

.listeSpecial{
列表样式：无；
列表样式位置：外部；
左侧填充：0；
左边距：0；
}
李：以前{
内容：属性（值）”；
文本对齐：右对齐；
显示：内联块；
宽度：45px；
右边填充：10px；
}

内置列表：

阿尔法
β
伽马射线
增量


标准列表（更好的间距和点对齐）：
阿尔法
贝塔
伽马
三角洲

在默认列表中，数字位于

ul/ol

s填充中

你可以像这样把圣路易斯变成这样

.listeSpecial{
列表样式：无；
列表样式位置：外部；
左侧填充：0；
左边距：0；
}
李：以前{
内容：属性（值）”；
文本对齐：右对齐；
显示：内联块；
宽度：45px；
右边填充：10px；
}

内置列表：

阿尔法
β
伽马
增量


标准列表（更好的间距和点对齐）：
阿尔法
贝塔
伽马
三角洲

谢谢，非常完美（！）。嗯，

45px

等等。嗯……你还表明HTML5+CSS2没有优雅的解决方案……有一些“CSS新闻”（可能是CSS3）来解决“十进制对齐经典问题”？参见丑陋（复杂）@PeterKrauss的解决方案：将左/右类放在那里并按它们对齐比这个更难看。在具有高数字/计数器的默认列表样式中，您需要增加列表左填充，如

ul{padding left:60px}

就像我在我的示例中所做的那样，它也会起作用。但是默认情况下，测试计数器长度并为列表设置填充并没有什么聪明的方法。谢谢，这是完美的（！）。嗯，

45px

，等等。嗯……您还表明HTML5+CSS2没有优雅的解决方案……有一些“CSS新闻”（可能是CSS3）来解决“十进制对齐经典问题”"? 请参阅@PeterKrauss的丑陋（复杂）解决方案：将左/右类放在那里并按它们对齐比这更丑陋。在具有高数字/计数器的默认列表样式中，您需要增加列表左侧填充，如

ul{padding left:60px}

，正如我在示例中所做的那样，它也会起作用。但默认情况下，并没有什么聪明的方法可以测试计数器长度并为列表设置填充。

<ul class="custom">
  <li value="II">Alpha</li>
  <li value="III">Beta</li>
  <li value="☸" >Gamma</li>
  <li value="MXX">Delta</li>
</ul>

.custom { list-style: none;  }
.custom li:before {
    content:  attr(value) ". ";
 }