私のスクロールバーはブラウザの右側にはありませんか？

私はCSS/HTMLの方が新しいです。学校のプロジェクトでは、私は1140pxの無応答のウェブサイトを作らなければなりませんでした。私は1140pxが白い背景色（ブラウザの真ん中）を両側に持っていて、暗い灰色にしたいと決めました。私のスクロールバーはブラウザの右側にはありませんか？

私は暗い灰色の色を私のhtmlに、白色は1140pxの幅で私の体に付けました。私はhtmlに "overflow：hidden"を置く必要がありました。そうしないと、体の白い背景色が表示されません。しかし、問題は、このスクロールバーが、ブラウザの右端に表示されていないため、このオーバーフローのために、私の体の右に移動するということです。私の問題の

スクリーンショット：

http://i68.tinypic.com/hvxjdj.png

html { 
    background-color: rgb(50,50,50); 
    overflow: hidden; 
} 

body { 
    line-height: 1; 
    width: 1140px; 
    margin: 0 auto; 
    background-color: white; 
    overflow: auto; 
    box-shadow:0px 0px 20px #000000; 
}

はオーバーフローの隠し財産を右に私のスクロールバーを移動し、無視する方法はありますか？同じバックグラウンド結果を得る別の方法ですか？

出典

2016-03-26 Sarah Van Den Berghe

を助けるかもしれないスニペットはありますか？あなたの情報を私が[fiiddle]（https://jsfiddle.net/MrLister/8m6w3876/1/）にすると、ここにスクロールバーが表示されますウィンドウの右端。 –

一般的には、HTMLタグをあまりにもスタイリングするのは避けてください。多くの場合、HTMLタグはブラウザによって別個のブロック要素として見られません。明らかにここでは、HTMLタグのオーバーフロー宣言を削除し、必要なものを構成するためのより良い方法を探し出す必要があります。本文とコンテンツのdiv。 – Scott

確かにあなたは右氏リスターは、このコードがあった問題は、私は全体私のCSSを通じて見えた何か他のものがあった、している： HTMLは、体{ のmin-height：100％; 高さ：100％; } 削除しても問題ありません。私は、他に何かが問題のおかげであると私に気付かなかった！将来私は別の方法、これに新しい試みますが、私はすべてを覚えています、あまりにもスコットありがとう！ –

htmlでoverflow:hiddenを削除し、身体の幅を100％にして背景色を透明にします。これは完全な濃いグレーのページを提供します（HTMlには既にグレーのバックグラウンドがあります）。ボディの内側にdivを追加し、その背景色を白に設定します。また、左と余白をいくつかの余白を与えることによって、あなたのdivを中央に配置するようにします。このdivにすべてのコンテンツを入れます。それで、ブラウザの右端にスクロールバーが表示されます。あなたはスニペットや問題を示していjsfiddleか何かを作ることができますここで、あなたに

html{ 
 
    background-color:grey; 
 
} 
 

 
body{ 
 
    width:100%; 
 
    height:auto; 
 
    background-color:transparent; 
 
} 
 

 
.appContainer{ 
 
    margin: 0px 40px 0px 40px; 
 
    background-color:white; 
 
    height:2000px; 
 
}

<body> 
 
<div class="appContainer"> 
 
    
 
</div> 
 
</body>

出典

2016-03-26 19:04:38

ありがとう！私は次回このようにします。私はそれを行う正しい方法を知らなかった:) –

@SarahVanDenBergheこの解決法があなたの問題を解決するのに役立つなら、答えとしてマークしてください。それは将来の聴衆にとって有益かもしれない –

私のスクロールバーはブラウザの右側にはありませんか？

答えて

関連する問題