html - HTML td のコンテンツに下線を引いて整列

Question

単一の td の内容に下線を付けたい。また、コンテンツは双方向に揃える必要があります。1 つのフィールドを左に、もう 1 つのフィールドを右に。どうすればこれを達成できますか？

金額 : 10.00 米ドル

---

Answer 1

これを行うには、「td」タグに幅を具体的に設定してから、適切なコンテンツを span または em タグにカプセル化します。

HTML の場合:

<td>Amount: <span>10.00 USD</span></td>

CSS の場合

td{
    display:block;
    width:400px;
}

span{
    float:right;
    width:auto;
}