WEBデザインテクニック|KLUTCHE

【CSS】max-width を IE でも使う方法

画像を一定サイズ内に収めて表示する超便利なCSS「max-width」「max-height」。
IE6・IE7 では使うことができませんが、少しCSSを細工してやればできるんです!

デモ

デモページ

CSS

img.resize {
	max-width: 200px;
	max-height: 200px;
	width: expression(this.width >= this.height ? "200px" : "auto");
	height: expression(this.width <= this.height ? "200px" : "auto");
}

expression?

expression 関数は IE の独自 CSS 拡張です。
expression 関数を使うとCSS内に Javascript を書くことができます。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です