11

ここでの例：http：//jsfiddle.net/R7GUZ/3/

私は、list-style次のスタイルの親OLのためにWebkitで作業するのにかなり の時間を費やしています。

-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>

</ p>

4

2 に答える 2

15

sに20pxのマージン左を追加するとli、トリックが実行されました

ol li {
   list-style: decimal;
   margin-left: 20px
}
于 2012-09-10T18:33:06.477 に答える
8

数字は実際には隠されているようです。これは、次のプロパティを使用して解決できます。

OL {
  list-style-position: inside;
}

marginおよびプロパティをリセットした場合（CSSが正規化paddingされたjsFiddleの例のように）、列が正しくフォーマットされるように、それらを正しい値に設定する必要があることに注意してください。

于 2013-02-14T11:46:31.557 に答える