IE7になってマシになったと思っていたんだけど、ちょっとコーディングするとまだバグにぶつかるなあ。
今回ぶつかったのは画像をフロートさせた場合に左側に3pxのマージンが発生するというもの。フロート要素のマージンが倍で計算されるというのはよく出会うがこれは初めてなのか、今まで気づかなかったのか。
InternetExplorerWinBugsにある、”IE may add unwanted space in several circumstances” の亜種と思われる。
リストに関しては対処法として margin-left:-3px とするとあるが、これだとimgごとfloatさせてギチギチに詰めている場合などに不具合がある。
たとえば
<img src="./images/gazou.jpg" style="float:left;width:200px;height:230px;_margin-left:-3px" />
などとするのはフロートしているブロックが実質203pxになってしまう。かといって _width:197px; などとすると画像のwidthが変わってしまって都合が悪い。（アンダーバーはIEのみに通るhack CSS表記）
要するにCSSをimgに使わなければいいことなので、imgをdivで囲い、そちらにCSS指定を移すことで回避できる。
<div style="float:left;width:200px;height:230px;">
<img src="./images/gazou.jpg" width="200" height="230" />
</div>