右パディングを設定した要素の末尾にbr要素を置くとレイアウトが乱れる

症状

left以外の値が指定されたfloatプロパティかtext-alignプロパティが親要素に指定されているとき、右パディングwhite-space: nowrap; が指定され内容物の末尾にbr要素がある要素の周辺のレイアウトが乱れる。

例示

<p style="text-align:center;">1行目 1行目 1行目<br>
2行目 2行目
<span style="padding-right:1px;">2行目<br></span>
3行目 3行目 3行目<br>
4行目 4行目 4行目</p>

1行目 1行目 1行目
2行目 2行目 2行目
3行目 3行目 3行目
4行目 4行目 4行目

2行目の末尾に問題を起こす形式の要素を置いています。

スクリーンショット

Moz1.0.2Moz1.0.2での表示(標準モード)

Op7Opera7.03での表示(互換モード)

補足

右パディングだけが設定された状態でレイアウトの乱れが最も大きくなります。同時に左パディングを設定するとこのバグを回避できます。

<p style="text-align:center;">1行目 1行目 1行目<br>
2行目 2行目
<span style="padding:0 1px;">2行目<br></span>
3行目 3行目 3行目<br>
4行目 4行目 4行目</p>

1行目 1行目 1行目
2行目 2行目 2行目
3行目 3行目 3行目
4行目 4行目 4行目

修正状況

Opera7.03では標準・互換モードの両方で不具合の発生が確認されました。

スポンサーリンク

関連記事

スポンサーリンク

event.keyCode

ホームページ製作・web系アプリ系の製作案件募集中です。

上に戻る