closeこの記事は 3 年 11 ヶ月 26 日 前に書かれたものです。
最新の情報とは異なる場合がありますのでご注意ください。

以前書いた IE7のズーム機能の問題の解決策がわかりました。

まず、position プロパティを使ってレイアウトした場合に、拡大/縮小すると要素同士の間隔が広がっていったり、縮まって重なり合ったりする問題。

これは position:relative を指定した要素同士を包括する要素(例えば body)にも position:relative を指定してやることで解決します。

そして、 body の背景に画像を配置した場合に背景画像が拡大/縮小されない問題。

これは背景画像を body 以外に指定してやればいいわけで、<body> の内側に例えば <div id="body-inner"> といった要素を追加し、この #body-inner に背景画像を指定すれば解決します。

もうひとつ、前回書かなかったのですが、float あるいは display:inline を設定して li 要素などを横に並べた場合、それに設定している背景画像やボーダーがズームによってずれます。

これはその要素に zoom:1 を指定してやればOKですが、zoom プロパティは IE の独自仕様なので W3C の Validation に引っかかります。なので、IE専用の CSS に書いて IE の条件付きコメントで HTML に読み込ませるなどの工夫が必要です。

#このサイトは見直したいところが沢山あるので、まだ直していません。w