如何使設置的文本大小填充容器

Question

我希望通過在單詞之間放置盡可能多的空間以使第一個和最后一個單詞觸及末尾，從而使具有設置的文本大小的文本填充容器。

示例：如果有三個單詞/項目，則第一個單詞在最左邊，第二個單詞在中間，第三個單詞在最右邊。

我想使用CSS執行此操作，但是我不介意javascript / jquery。

Answer 1

使用一些JavaScript，因此您可以將其與IE7 http://jsfiddle.net/NTx2A/一起使用

Answer 2

<div class="line trio">
    <div class="unit left">One</div>
    <div class="unit mid">Two</div>
    <div class="unit right">Three</div>
</div>
<div class="line quartet">
    <div class="unit left">One</div>
    <div class="unit mid">Two</div>
    <div class="unit mid">Three</div>
    <div class="unit right">Four</div>
</div>
<div class="line duet">
    <div class="unit left">One</div>
    <div class="unit right">Two</div>
</div>

---

.line {display: table; width: 100%;}
.unit {display: table-cell;}

.duet    .unit {width: 50%;}
.trio    .unit {width: 33.3%;}
.quartet .unit {width: 25%;}

.left  {text-align: left;}
.mid   {text-align: center;}
.right {text-align: right;}

Answer 3

表格在這里工作得很好。

<table width="400" border="1">
<tr>
    <td style="text-align:left">one</td>
    <td style="text-align:center">two</td>
    <td style="text-align:center">three</td>
    <td style="text-align:center">four</td>
    <td style="text-align:right">five</td>
</tr>
</table>

無需使用CSS或JS來欺騙，這完全是自動的。