css - 上付き文字に必要であるがテーブル属性によって適用される垂直整列のオーバーライド

Question

以下は私のコードです：

<table border="0" cellspacing="1" cellpadding="0" width="100%">
<tr>
<td width="31%" align="center" valign="middle">
<a href="http://google.com/"></a> 
</td>
<td width="69%" valign="top">
Terms and conditions
<sup>#</sup>
</td>
</tr>
</table>

superscriptは機能していません（＃は上部にありません。利用規約のテキストと同じ行にあります）。

私の推測ではvertical-align、属性superscriptによってオーバーライドされています。table

table以下は、 Web開発者から取得した属性のデフォルトの使用スタイルシートです。私もキャプチャしましたsup。Web開発者がその価値を打ち負かしているとは思えません。

tbody {
display: table-row-group;
vertical-align: middle;
border-color: inherit;
}

tr {
display: table-row;
vertical-align: inherit;
border-color: inherit;
}

td, th {
display: table-cell;
vertical-align: inherit;
}

td[Attributes Style] {
width: 31%;
text-align: -webkit-center;
vertical-align: middle;
}

sup {
vertical-align: super;
font-size: smaller;
}

属性のsup外側に配置すると、正常に機能します。tableどうすればsup内部で作業できtableますか？

Answer 1

valign="top"が原因です。それを削除すると、上付き文字が機能します。

<td width="69%">
    Terms and conditions<sup>#</sup>
</td>

または、v-align を維持したい場合は、カプセル化します。

<td width="69%" valign="top">
    <span>Terms and conditions<sup>#</sup></span>
</td>