小さな画面の背景サイズ

Question

ここではこのWordPressサイトhttp://www.grappler.tk/dyebeta/のサイズを小さくしてブラウザを500px以下に変更すると、スクロールバーが下に表示され、右手のサイズに空きスペースができます。

Answer 1

ヘッダーロゴは600ピクセル幅です。 ＃header-logoの中の子は、％widthまたは設定されていない幅を持っているにもかかわらず、スクロールバーを引き起こします。したがって、オーバーフローしているようには見えません。

＃header-logoには幅がありません。@mediaクエリを使用して、min-width：600pxを大きな画面に追加することもできます（浮動小数点などのため幅が必要な場合）。 width：600pxに設定し、他のすべての人に600pxの最小幅を設定します（これはあなたの応答性を損なうでしょう）。

ブラウザのサイズを500pxより小さくすると、メインボックスの幅は90％に設定されています。本文の90％。奇妙なことに、あなたのボディ要素は私の期待通りにやっています（あなたのラップより少し広いです）が、背景色は続けています（通常はやはりカットされます）。たぶんそれはhtml要素にペイントされています。html要素は何があっても常にビューポートを塗りつぶします。

私は身体を愛して：コンテンツの後、それがきちんとデバッグツール

Answer 2

のはstyle.cssにライン68（＃ヘッダーロゴ）から幅600PXを削除

幅600PXは、CSSの下から削除されます。

#header-logo { 
    float: left; 
    text-align: left; 
    vertical-align: middle !important; 
}