画像ロールオーバー時にボーダーを表示してもレイアウトを崩さないCSSトリック:phpspot開発日誌

Image Rollover Borders That Do Not Change Layout 画像ロールオーバー時にボーダーを表示してもレイアウトを崩さないCSSトリック。 ロールオーバー時に、border指定すると、次のように、普通は崩れてしまいますが、それを崩さない方法。 ↓↓崩れてないサンプル↓↓ 画像の中にボーダーが引かれ、レイアウトに影響がない例 overflowとmarginを使ったテクニックでこれが可能みたいです。 地味だけど、知っておかないと詰まってしまいそうな必須のテクニックかもしれませんね。 関連エントリ 便利なＣＳＳテクニック３０選 CSSとdivを使った画像先読みテクニック ページ全体に枠線をつけるCSSテクニック サイズの大きい画像を背景にする際のCSSテクニック

[gotack]

border

[paranod]

画像ロールオーバー時にボーダーを表示してもレイアウトを崩さないCSSトリック

[otchy210]

これはすべてのリンク付き画像に対して適用したい。Inner Border がスマートでいいな。Outer Border は IE6 でうまくいってない。