spanタグなどのインライン要素にボーダーやパディングが効かない。
例
テスト
テスト
テスト
対象ブラウザ
Windows
Internet Explorer5
回避方法
IE5.xに対して height:1px; を指定する。
height を小さく指定しても、内包要素に合わせて拡大されます。
width:1px;でも回避できますが、この場合、日本語であれば1文字づつ、英語であれば1単語づつ改行されるため、必要に応じて white-space: nowrap; を指定する。
ただし white-space はIE5.5からの実装のためIE5.0には適応できない。
[参考記事] CSS辞典 white-space
[参考記事] ページナビについて
テスト
インライン要素にpaddingやborderを付けると、重なるのは仕様です。
ただしインライン要素に幅や高さを指定するとIEとそれ以外のブラウザで表示が変わります。
[参考記事] インライン要素に幅や高さを指定するとボーダーやパディングが重ならない。
テスト
テスト
テスト
関連プロパティ
display要素の表示形式(ブロック・インライン)を指定する
borderボーダーのスタイル・太さ・色を四方まとめて指定する
border-bottom下ボーダーのスタイル・太さ・色を指定する
border-bottom-width下ボーダーの太さを指定する
border-left左ボーダーのスタイル・太さ・色を指定する
border-left-width左ボーダーの太さを指定する
border-right右ボーダーのスタイル・太さ・色を指定する
border-right-width右ボーダーの太さを指定する
border-top上ボーダーのスタイル・太さ・色を指定する
border-top-width上ボーダーの太さを指定する
paddingパディングに関する指定をまとめて行う
padding-bottom下パディングを指定する
padding-left左パディングを指定する
padding-right右パディングを指定する
padding-top上パディングを指定する
主要ブラウザに非対応