テンプレートの事で質問です

テンプレートの事でお伺いします。

今、テンプレートを作成しているのですが、firefoxでは思ったように表示が出来ません。

http://hiromi.dokkoisho.com/1.html

このページなのですが、ＩＥでみるとサイドバーの色が灰色に見えるのですが、firefoxでは表示されません。

どこか間違っているでしょうか？

よろしくお願いします。

No.3 回答者： koke29 回答日時： 2009/02/03 23:38

ファイヤーバグでCSSいじってみたら float消したら背景出てきました

とりあえず、書き方が間違っているんだろうなぁとは思いますー
（IEの表示は間違いで、Firefoxが正しいんだと思います）

的確な返答が出来ず申し訳ないです…

この回答へのお礼

回答ありがとうございました。

１から作り直してなんとか上手くいきました。

お礼日時：2009/02/04 13:31

No.2 回答者： koke29 回答日時： 2009/02/03 20:41

h3の見出しとか書いてるとこの背景色ですか？

該当箇所のCSSがわからないと誰も返答出来ないですよ

class="sidebar"
これの内容、具体的に出して下さいねー

この回答への補足

説明不足ですいません。

みにくいですが、CSS載せておきます。

よろしくお願いします。
説明不足ですいません。

みにくいですが、CSS載せておきます。

よろしくお願いします。

body {
margin : 0px auto 0px auto;
width : 800px;
text-align : center;
padding-top : 0px;
padding-bottom : 0px;
}
.header{
width : 800px;
height : 150px;
background-image : url(img/header.jpg);
background-repeat : no-repeat;

text-align : left;
padding-top : 0px;
margin-top : 0px;
margin-left : auto;
margin-right : auto;
}
.description{
font-size : 80%;
padding-left : 12px;
padding-right : 12px;

width : 300px;

position : absolute;

}
.site{
font-size : 100%;
font-weight : bold;
padding-left : 13px;
padding-right : 13px;
margin-top : 55px;
position : inherit;
}
.main{
width : 574px;

bottom : auto;
float : left;
font-size : 90%;

padding-left : 18px;
padding-right : 18px;
padding-bottom : 18px;
text-align : left;
}
.sidebar{
width : 190px;

float : right;
bottom : auto;
text-align : left;
display : inline;
}
.footer{

text-align : center;
width : 800px;
clear : both;
height : 75px;
background-image : url(img/footer.jpg);
background-repeat : repeat-x;
margin-left : auto;
margin-right : auto;
}

.footermain{
padding-top : 28px;
padding-left : 13px;
padding-right : 13px;
padding-bottom : 13px;
}
.box{
width : 810px;
background-color : white;
margin-top : 0px;
margin-left : 0px;
margin-right : 0px;
margin-bottom : 0px;
padding-top : 0px;
padding-left : 0px;
padding-right : 0px;
padding-bottom : 0px;
background-image : url(img/box-back.jpg);
background-repeat : repeat;
background-position : 0px 0px;}


#main-menu-back{
background-image : url(img/menu-back.jpg);
background-repeat : repeat-y;

width : 800px;

background-position : 0px 0px;
margin-top : auto;
margin-left : auto;
margin-right : auto;
margin-bottom : auto;

padding-top : 0px;
padding-left : 0px;
padding-right : 0px;
padding-bottom : 0px;
}

補足日時：2009/02/03 23:05

No.1 回答者： ORUKA1951 回答日時： 2009/02/03 17:06

　サイドのスクロールバーは、ＩＥは、ページのたてサイズがウィンドウよりも低いときにも表示されてしまいます。

　他のブラウザは、たてサイズがウィンドウよりも高いときに限って表示されます。これは、Opera,Safari,fireofxいずれも・・・。
　図は、ウィンドウの縦サイズを小さくしたときのものです。

　本来、スクロールが必要なときのみ、表示されればよいのでIEの動作はおかしい。

　なお、ウィンドのサイズを色々変えるとＩＥだと横幅が狭くなるとはみ出したり、はみ出してもスローロールバー(横)が表示されないなど、問題があります。
　必ず、小さなディスプレイでの訪問者のために、ウィンドウサイズは伸縮して確認しましょう。
　最大でも800px幅まで縮小してもよいように、ある程度は伸縮に耐えるように、またIEのブロックサイズ判定のバグも考慮しましょう。いずれＩＥ8では改善されますので・・・