如何在页面上将一个列表分成两半

时间:2014-11-27 18:22:42

标签: css list html-lists multiple-columns sublist

我有一个很长的列表,类似于此,有3个级别的缩进。然而,它很长,我想打破它,让我们说6.4并使列表50%宽度,一半列表向左浮动,另一半向右浮动。有点像这张照片,但有2个而不是3列。

http://alistapart.com/d/multicolumnlists/example0.gif

<ol class="main">
<li>MAIN HEADING
    <ol>
        <li>This is an example of a sub-clause and you can see that even though the words continue on to the right, it would be best if it wrapped around and formed a block to the right of the decimal number</li>
        <li>In doing so the normal second clause should also wrap around but the second subsequent clause should hang in from the left and be in a block.  See below for the remaining clauses
            <ol>
                <li>this list is completely for demonstration and should  not be construed as legal language in any way, nor should make sense in that</li>
                <li>should the indentation take  more than:
                    <ol>
                        <li>this many lines it would be overly big</li>
                        <li>legal numbering continues in the sub-sub clauses with the use of lower roman lettering and should flow below in a block</li>
                        <li>and continue the formatting on to the next line but be underneath the body of the the text and not begin directly below the number itself. In this example the text carries out to the right but I need it to wrap around underneath.</li>
                    </ol>
                </li>
            </ol>
        </li>
    </ol>
</li>
<li>Second Clause Heading
    <ol>
        <li>This is an example of a sub-clause and you can see that even though the words continue on to the right, it would be best if it wrapped around and formed a block to the right of the decimal number</li>
        <li>In doing so the normal second clause should also wrap around but the second subsequent clause should hang in from the left and be in a block.  See below for the remaining clauses</li>
    </ol>
</li>

我试图设置'start =“6”',但它不允许小数位。另外,我使用计数器并通过css属性'content:'

添加数字

有更简单的方法吗?

0 个答案:

没有答案