IE6 と IE７ のmargin幅が違い、とても困っております。

質問

お分かりになる方

どなたか助けてほしいです。
２点ございます。

(1)

こちらをご覧ください。
http://pandeiro.jp/suda/index.html

靴の画像が９つ並んでいるのですが、
IE７だと、靴の上のマージンは、2px　なのですが、
IE６だとなぜか5pxくらい空いてしまいます。

(2)

http://pandeiro.jp/suda/shoes/spring/index.html

右上の小さな４つのメニューですが、
<div id="menu2"></div>で４つを囲っておりまして、
border-bottom-width: 3px;
border-bottom-style: solid;
border-bottom-color: #000000;
で黒いボーダーを引いているのですが、

IE７だと上の４つの画像とくっついているのですが、
IE６だと相変わらず　３PXほどの空白が生じてます。

どうか、よろしくお願いいたします。

回答No.2

hikachu

うまくいきませんでしたか。。

でHP見させて頂きまして
ソース見ました
ぱっと目にとまったのが
id="shoes"←こいつです

idなのに何度も使われています。。。

記述の間違いから正していくのがいいかもしれないですね（笑）

http://openlab.ring.gr.jp/k16/htmllint/htmllint.html
↑
ここでチェックしてみてはどうでしょう？

お礼

>>hikachuさん

本当にありがとうございます。
サイトのご紹介にも感謝いたします。

こちらを元に、もう一度基礎から頑張ります！

回答No.1

hikachu

floatかけている所に
display:inline;

追加してみてください

補足

hikachu様

御返答ありがとうございます。
追加してみましたが、改善ができません。

floatがかかっているcssにすべて追加したら、
デザインが乱れてしまいました。。

御協力いただいたのに、成果がだせなくて申し訳ないです・・・