html - 如何将列表中的每个单词排成一行，以便条目在水平方向上从同一点开始？

这是一个我对previous SO question进行了一些更改的示例：
http://jsfiddle.net/tPjQR/72/

ol {
    font-family: Georgia, serif;
}
ol span {
    font-family: Arial, sans-serif;
    font-size: 17px
}

<ol>
    <li><span>Entry one</span></li>
    <li><span>Entry two</span></li>
    <li><span>Entrye three</span></li>
    <li><span>Entry five</span></li>
    <li><span>Entry six</span></li>
    <li><span>Entry Long Long Long Long Long Long Long Long Long Long Long Long Long Long Long Long Long</span></li>
</ol>

我想将各列对齐，这样一来，无论一列中有多少文本，每列的第一个字符都将对齐。

例如。

不

Entry one
Entry two
Entrye three
Entry five
Entry six

宁可

Entry  one
Entry  two
Entrye three
Entry  five
Entry  six

有没有办法使用列表项执行此操作，或者我需要使用表格吗？

最佳答案

使用以下代码进行设计...

li span {
    display:inline-block;
    width: 25%;
}

<ol>
    <li><span>Entry</span> one</li>
    <li><span>Entry</span> two</li>
    <li><span>Entrye</span> three</li>
    <li><span>Entry</span> five</li>
    <li><span>Entry</span> six</li>
</ol>

关于html - 如何将列表中的每个单词排成一行，以便条目在水平方向上从同一点开始？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/44965946/