on:2007年1月19日sponsorsIE7で拡大・縮小時にレイアウトが重なってしまったり、IEでフロートした要素がはみ出てしまったりとIE独自のCSSのバグがいくつかあります。これは、IEのhasLayoutが原因のひとつとなっているので、それを回避する方法を考察します。hasLayoutとはIEでのCSSのバグを回避するhasLayoutの値CSSのバグに効果のあるhasLayoutの指定方法hasLayoutの参考ページhasLayoutとはhasLayoutとは、オブジェクトがレイアウトを持っているかどうかを示すものです。hasLayoutの値はread-onlyのため読み込みのみ可能で、falseとtrueがあります。hasLayoutの値(read-only)falseデフォルト値。オブジェクトがレイアウトを持っていない。trueオブジェクトがレイアウトを持っている。前述した拡大・縮小時にレイアウトが重なってしまったり、フロートした要素がはみ出てしまったりするバグは、このhasLayoutの値がfalseの場合に起きます。これらのIEでのCSSのバグを回避するためには、hasLayoutの値をtrueにする必要があります。hasLayoutの値をtrueにするには、CSSで特定のプロパティに下記の値を指定します。valueIEのCSSでのバグを回避するためには、例えば「height」の値に「1%」を指定し、「hasLayout」の値を「true」にして回避します。上記の表の中でよく使用されているものは「height="1%"」や「widthの値を指定する」などがあります。CSSのバグに効果のあるhasLayoutの指定方法hasLayoutを変更するプロパティには、「float」「position」「writing-mode」のように実装するレイアウトでその値を指定できないなどの制限があるものもあります。「height="1%"」のように特定の箇所には使用できないものもあります。そこで、「zoom」に注目してみました。「zoom」は指定した要素を拡大縮小の指定をするものです。ほとんどのレイアウトでは、拡大縮小せず100%の状態でユーザーに利用してもらうことを前提に制作していると思うので、この「zoom」を利用して指定する方法がよいと思います。CSSのバグに効果のあるhasLayoutの指定方法*{zoom:1;}「*」は全てのタグに適応する意味になります。全てを対象にするのが具合の悪い場合は、個別の箇所に指定してください。※「zoom」は、IE独自のプロパティのためw3cのCSSチェックなどではエラーがでますが、使用する上では不具合は特にありません。Posts関連記事が見つかりませんでした。