あるサイトで、この Web サイトのヘッダーにしばらく悩まされていました。ワードプレスのサイトです。ヘッダー ナビゲーション バーがメインのブログ エントリからはみ出しすぎています。多くのことを変更しようとしましたが、それらはすべて他の問題を引き起こします。
幅を 100% から縮小して余白を入れてみましたが、サイトのサイズを変更したり、小さな画面で表示したりすると問題が発生します。
中央に配置しようとしましたが、同じ種類の問題が発生します。
これは以下の私の問題です。白いナビゲーション バーがはみ出しすぎています。
（読みやすくするために不要と思われるコードの一部を削除しました）
メニューの背景を制御するCSSコードは次のとおりです
#menu_background {
width:100%; text-align:right; padding:10px 0;
margin-bottom:15px; /* for IE */ filter:alpha(opacity=95); /* CSS3 standard */
opacity:0.95;z-index:300; box-shadow: 0px 1px 2px rgba(0,0,0,0.07);
-moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.07);
-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.07);
}
これがメイン部分のhtmlです。コードを削除して短くしました。他の div 内にはありません。
<div id="menu_background">
</div><!--#menu_background-->