人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

CSSに詳しい方に質問があります。

最近、Webサイトを作っていて、見事にIE6のバグでつまづきました。ボックスに高さを指定してやることによって解決しましたが。

そういったバグの対策のためには、ホーリーハックというのが便利だと聞いたことがあったのを思い出し、調べてみましたが、なぜそういったheight: 1%;などでIE6向けの対策ができるのかがわかりません。(もちろん、MacIEも)

ホーリーハックについて、単に使い方を説明しているだけではなく、その背景やIEのバグ、どういったときに使えるのか、など、ホーリーハックについて詳しく解説しているサイトがあったら、教えてください。

●質問者: あらた
●カテゴリ:インターネット ウェブ制作
✍キーワード:CSS IE IE6 webサイト サイト
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● 186
●35ポイント

height: 1%;

構造のマークアップなしでフロートをクリアする方法で解説がされています.

IE6では, 高さを指定するとボックスサイズの算出時にフロートを除外せず, 内包する要素に合わせて外側のボックスを広げるという別のバグがあります.

ということは外側のボックスに高さを指定してやれば, IE6では外側のボックスは勝手に中のボックスの高さ以上の高さを持つことになります.

このIE6のバグについては, Internet Explorer (Windows) CSSバグリスト:幅や高さを指定した要素ではボックスサイズの算出時にフロートを除外しないをご参照ください.

蛇足:ホーリーハック (holly hack)

/* Hidden from Mac IE \*/
 div.notMacIE {background-color: red;}
/**/

みたいにMacIEのコメントに関するバグを利用したハックがホーリーハックです.

MacIEでは上記IE6でのバグが発生しないので, MacIEには読み込ませないようにしている訳です.

◎質問者からの返答

おー、なるほど。上のサイトの内容は読んだことあるのですが、いかんせん日本語が難しく。。。MacIEにはそのバグがないので、読み込ませないというのはなるほどです。

もう少し情報を待ちます。あと、よく分からないのは、たまにブログなどで「とりあえずIE6向けのバグは上記のheight: 1%;で対応する」みたいな記述をちょくちょく見かけることです。これはどうなんでしょうか?


2 ● hamster009
●35ポイント

数値指定が正確ではないので、パーセンテージ指定するということです。http://end

◎質問者からの返答

よく意味が分からないです。数値指定は分かるし、パーセンテージで指定するのも分かるんです。

ということは、複合的にWin IEにはバグがあって、それらを一気に解消するためにハックを使うわけですよね。

じゃあ、その複合しているのは一体どういうバグなのかを知りたいのです。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ