IE8における拡大縮小バグ

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

先日リリースされたIE8だが、多くのバグを含んでおり、まだまだWEB製作者を悩ませそうです。

(追記)Firefox3でも発生しますね。検証不足でした。

例えば、私が見つけたのは拡大縮小に関するバグ。(文字ではなくズームによる)

ul{
	margin:10px;
	width:600px;
	border:1px blue solid;
}
ul li{
	list-style-type:none;
	margin:2px;
	border:1px red solid;
	width:194px;
	height:194px;
	float:left;
	display:inline;
}

サンプル

などのようにリスト要素を利用して表状の形態を表現した際、通常は以下のように表示される。

IE8 100%で表示。

IE8 100%で表示。

これを95%に変更すると以下のようになる。

IE8 95%で表示。

IE8 95%で表示。

カラム落ちしてしまう。。。

どうも、IE8のズームは拡大縮小のみではなく再レンダリングが行われているようでwidthとmarginもしくはborderを含んだ要素の場合、拡大縮小の際の計算値が変わってくるようです。(ちなみにOSはWindows VISTA)

また、レンダリングエンジンの問題ではなくブラウザネイティブの問題のようで、IE8搭載のIE7互換表示ボタンやmetaによるIE7互換表示では対応できない。

また、IETesterやMicrosoft Expression Web SuperPreviewではちゃんと拡大縮小されたのでオリジナルのIE8以外では発見が難しいだろう。

IE8でも、やはりハックなどを利用してスタイルの定義を行う必要がありそうです。

関連エントリー

IE7でページが表示されない件について
float方向のmarginが倍増するバグへの対応
Firefox3でメイリオを指定するとinputのsizeが倍増する
Movable Typeで1日の00:00にエントリーを書いてはいけない
MT4.2でのconvert_breaksに関するバグ

スポンサードリンク

«現場のプロから学ぶXHTML+CSS 増刷(5刷)決定 | メイン | IE6,7,8の確認ツールの決定版!?Microsoft Expression Web SuperPreview»

このエントリーのトラックバックURL
http://blog.webcreativepark.net/cgi/mt/mt-bt.cgi/961
コメント

以前Firefoxでこの現象にあって悩まされました^^;

投稿者:Tsuysohi. | 2009年4月11日 11:13

ie8を 3台のPcに早速入れて試した、3台とも デスクトップの背景画面が通常より格段に大きく表示され、また、再起動をかけないと、画面が変らない症状が出た。
ie7に戻せない。

投稿者:daikoku | 2009年4月22日 14:08
コメントを投稿