0

問題を実証し、CSS での原因を明確にするために大幅な改訂を行いました。

Chrome と Safari では次のコードが表示されます。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style>
BODY { background:#fff; }
.survey_table TD {
    vertical-align:top;
}
</style>
</head>
<body>
<table class="survey_table">
<tbody>
<tr>
<td>
2. Are you familiar with the <a href="http://example.com">Louisiana Sanitary Code</a><sup>1</sup> requirements for laboratories to report notifiable (reportable) conditions to the Louisiana Office of Public Health?
</td>
</tr>
</tbody>
</table>
</body>
</html>

このような：

クロムのスクリーンショット

Firefox と IE では、次のように表示されます。

ファイアフォックスのスクリーンショット

この問題は TD の CSS からvertical-align:top; 発生しています。Webkit ブラウザーを FF や IE のように表示し、CSS の垂直方向の配置を維持する方法を知っている人はいますか?

4

2 に答える 2

2

テーブル以外の場所では問題なく動作するため、次のようにしました。

table sup {
    font-size: .85em;
    line-height: 0.5em;
    vertical-align: baseline;
    position: relative;
    top: -0.6em;

Chrome と Explorer の両方で許容できる結果が得られる

于 2015-08-04T15:25:52.983 に答える
1

私は同じ問題を抱えていたので、相対位置を使用することにしました。

Chrome と Safari で valign=top を使用したテーブルでの <sup> の不適切なレンダリング

于 2012-12-07T14:45:55.477 に答える