html - 右揃えのセルのテキストを左揃えにする

Question

最初の列はtableすべて右揃えのテキストです。tdの align プロパティが既に右にある場合に、テキストのみを左に揃える可能性はありますか?

理解を深めるために：

HTML:

<table class='tcl'>
<tr>
<td>first column</td>
<td>second column</td>
</tr>
...
</table>

CSS:

.tcl {
    border-spacing:0;
    border-collapse:collapse;
    width:100%;
}

.tcl tr {

    height:50px;
}

.tcl td {

     width:50%;
     text-align:left;
}

.tcl td:first-child {

     text-align:right;
     /* i would like to align the text of this right aligned column to the left*/
}

編集：多くの人は、私が何を意味するのか本当に理解していません. Text-align は、テキストを親の選択された側に移動するだけでなく、テキストが互いに整列する方法も変更します。

だから私が達成したいのはこれです

   first   row
   second  row
   third   row

そしてこれではない

    first  row
   second  row
    third  row

したがって、最初の列のテキストはどちらの場合も右揃えになりますが、テキストの配置は最初の場合は左、2 番目の場合は右になります。これで説明がつくことを願っています。

Answer 1

テーブルのすべての行にまたがるtd最初trの にエクストラを追加し、幅を に設定することで、それを行うことができます。次に、 を設定すると、コンテンツが 1 行に収まるのに十分なスペースが確保されます。table100%white-space: nowraptd

jsFiddle

HTML

<table>
    <tr>
        <td rowspan="999"></td>
        <td>text</td>
    </tr>
    <tr>
        <td>longer text</td>
    </tr>
</table>

CSS

table {
    width: 100%;
}
tr:first-child td:first-child {
    width: 100%;
}
td {
    white-space: nowrap;
}

Answer 2

から削除してみてwidthください.tcl td

.tcl td {
     text-align:left;
}

Answer 3

最初の td を右に浮かせてみませんか。

.tcl td:first-child {
     float:right;
}