CSSでのmin-width&min-height。
使えると結構便利だったりしますが、
IEでは対応していない等で普段はあまり敬遠しがち。

IE7からは対応しているので問題ないのですが、
IE6で実現するにはJavaScriptを使ったり何かと面倒だったり。

そこでハック的な構成でIE6でmin-width&min-heightを実現する方法。
下記の記述方法で可能なもよう。

【IE6対応 min-width】
div {
   min-width:100px;
   width: auto !important;
   width: 100px;
}

【IE6対応 min-height】
div {
   min-height:100px;
   height: auto !important;
   height: 100px;
}

min-heightについては、IE6ではheight要素で設定した値が
中の要素がその値以上になれば自動で広がるので必要なかったりするのですが、
widthについてはその様にはいかず、
この記述が活用できるのではないかと思います。

それとmin-width&min-heightには関係ないですが、
CSSで背景画像を使って画像にロールオーバーを付けた際に、
初めのマウスオン時に画像がチラつくのも下記ハックで回避できるようです。

【IE6対応 ロールオーバー時の画像チラつき回避】
html {
   filter: expression(document.execCommand(“BackgroundImageCache”, false, true));
}

無駄なJavaScript設定も必要なくなりそうです。

  • このエントリーをはてなブックマークに追加
BlackFlag
FOLLOW

Related Posts

Comments (1)

  • CSSでのIE6対応のmax-width - BlackFlag | 2010.10.04 0:00

    [...] 以前、ここでIE6で「min-width」を実現させるハックは書きましたが、 CSSplayサイトにて、IE6で「max-width」を実現させる方法があったので紹介。 [...]







コメント内容

※コメントにHTMLタグを直接入力しないでください。
※HTMLタグを入力する際はタグ一つ一つの括弧「<」「>」を全角に変換して入力してください。
コメントは承認制になっているのですぐには反映されません。コメント頂いた内容については出来る限り早めの対応を心掛けていますが、時期によって返答が遅くなってしまうことがありますので、何卒ご了承ください。
» コメントについてのご注意  |  » ライセンスに関して

IE6用の便利ハック[min-width、min-height、ロールオーバー時の画像チラつき防止]

Hatena Bookmark
Popular Entries
Recent Entries
PR
Facebook
Tweets
Animal Protection
  • 福島被曝牛支援のお願い
  • NO FUR
Books
  • jQuery Technical Note
  • 外掛OUT! jQuery 高手精技
Partner