这总是让我感到害怕。为什么列表是这样的?如果你将margin和padding设置为0,你可以期望它在左边的文本正常对齐,但是没有。这就是列表项标签中的文本开始的地方,然后它将子弹和/或数字渲染到左侧,重叠边框等。为什么他们还没有修复它呢?他们心智正确的人决定成为名单的行为?您甚至无法为左侧指定准确的填充或边距以使数字与正常文本保持对齐,因为当数字计数达到更高级别时它不会自动向右移动(例如9 - > 10,现在是2位数并在左侧占用更多空间。)
无论如何,一个问题:是否有任何简单的方法(不使用JavaScript等)来解决这个问题,最好是在CSS中?我想让左边的数字仍然向右对齐,但仍然将整个列表与文本左边对齐。
lists http://img338.imageshack.us/img338/8957/lists.jpg
我知道你可以使用表来实现这一点,但这不是一个有序列表,现在是吗?
修改:注意list-style-position
属性如何使第十个元素向右推文字,使其不均匀。我想移动右上方的深蓝色框,使深蓝色的左边缘与周围的文本对齐,但我不能简单地设置填充值,因为它需要移动的数量根据数量而变化物品。
list-style-position http://img707.imageshack.us/img707/9277/liststyleposition.jpg
答案 0 :(得分:2)
要获得该效果,请使用:list-style-position:inside;
http://www.w3schools.com/Css/pr_list-style-position.asp
关于列表可能性的另一篇(小旧)文章:http://www.alistapart.com/articles/taminglists/
答案 1 :(得分:0)
正如另一张海报所提到的,默认位置为outside
。
由于不一致和错误,样式列表很难处理跨浏览器。我建议使用JS或服务器端脚本生成一个span
元素,其中包含相应的数字和样式(使用循环和诸如此类的东西)。
非常肯定,考虑到IE的可怕列表渲染错误,不可能设置跨浏览器的样式。