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

質問

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

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

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

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

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

よろしくお願いします。

回答No.3

koke29

ファイヤーバグでCSSいじってみたら float消したら背景出てきました
とりあえず、書き方が間違っているんだろうなぁとは思いますー
（IEの表示は間違いで、Firefoxが正しいんだと思います）

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

お礼

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

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

回答No.2

koke29

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;
}

回答No.1

ORUKA1951

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

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

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