如何修复在Webkit上使用CSS3列时未显示的列表样式

Question

例如:http://jsfiddle.net/R7GUZ/3/

我有一段时间list-style在webkit中为一个用它设计的父OL工作

-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;

如何使用css3将有序列表格式化为列并仍保持list-style样式？

           <ol class="text-col2">
                <li>
                    <strong>Can we call you?</strong>
                    <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia.</p>
                </li>

                <li>
                    <strong>Can we call you?</strong>
                    <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia.</p>
                </li>
            </ol>

​

Answer 1

向lis 添加20px的边距就可以了

ol li {
   list-style: decimal;
   margin-left: 20px
}

Answer 2

似乎数字实际上是隐藏的.这可以通过使用以下属性来解决:

OL {
  list-style-position: inside;
}

请注意,如果您已重置margin和padding属性(例如在jsFiddle中已对CSS进行规范化的示例),则必须将它们设置为正确的值,以便正确格式化列.