html - 有序列表中的全宽水平线

Question

在this fiddle ，您可以看到水平线并没有一直穿过(在数字下方)。我想要它。我试过使用 list-style-position:inside;，但这意味着我无法强制数字出现在正确的位置(因为左边的图像是 float 的)。有没有一种优雅的方法可以使用 CSS 来完成此操作，还是我必须自己生成编号然后适本地设置样式？

Answer 1

您似乎很清楚 list-style-position 属性，所以您应该知道为什么水平线不会在元素符号/编号下一直延伸。该列表的左侧有一个填充，将列表元素推到右侧。他们的内容不会超出他们的空间 :)。

我是这样解决这个问题的:http://jsfiddle.net/J4b6Y/14/

[编辑]

针对 webkit 浏览器的修复:http://jsfiddle.net/J4b6Y/16/

[编辑2]

适用于所有浏览器并且具有有效的 HTML o_O http://jsfiddle.net/J4b6Y/37/

[编辑3]

好的，这是另一个... http://jsfiddle.net/J4b6Y/39/