0

IEとFirefoxでデザインが崩れてしまいます；；
原因がわからないのですが、どなたか原因と対処法を教えてください・・・。
CSSを中心にしています。 http://www5.pf-x.net/~mon/1.htm
上のURLが今作っているページなのですが、
Firefoxだと、右上のフォーム部分がバナーの隣に来るのですが
IEだとなぜかフォーム部分が下に来てしまいます。原因と対処法を教えてください。

FirefoxはCSSに厳格だと聞いたのですが、IEが曖昧なためになってしまったのでしょうか？
文字数でCSSしか貼れないので、上記URLからHTMLを診断してもらえると助かります。

@charset "utf-8";
/* ------------------------------
基礎設定
------------------------------ */
body {font-size:0.875em; margin:0; padding:0; line-height:1.4; color:#c0c0c0; background:#000000; background-image: url("back.jpg"); background-repeat: no

-repeat; background-position: 99% 95%; background-attachment:fixed; text-align:center; margin:0 auto 0 auto;}
img {border:0;}
address {font-style:normal;}

/* ------------------------------
ページ枠組み設定
------------------------------ */
.box {width:800; margin:0 auto 0 auto; text-align:left;}
.main {width:80%; float:left; text-align:left; font-size:0.875em;}
.side {width:20%; float:left; text-align:left; font-size:0.875em;}
.top1 {width:50%; float:left; text-align:left; font-size:0.875em;}
.top2 {width:50%; float:left; text-align:right; font-size:0.875em;}
.bar {width:100%; height:41; text-align:center;}

/* ------------------------------
クリアの設定
------------------------------ */
.end {clear:both;}
.end hr {display:none;}

/* ------------------------------
メニューの設定
------------------------------ */
.menu a{display:block; width:96px; color:#c0c0c0; background:url(menu-img/menu1.jpg) no-repeat; height:41px; line-height:43px; text-decoration:none; text-

align:center; font-size:0.9em; font-weight: bold; float:left; font-family:verdana,arial,sans-serif;}

.menu a:hover{color:#e9e9e9; background:url(menu-img/menu2.jpg) no-repeat;}

質問者が選んだベストソリューション

Yahoo!知恵袋 5534日前