0


0

Cssヘッダーの問題

背景があるヘッダークラ​​スと、ヘッダーのnavコンテンツを提供するヘッダーセンタークラスがあります。 私の問題は、ウィンドウがヘッダーの中央の幅よりも小さい場合、スクロールするとヘッダーの背景が上部全体に表示されないことです。 Stackoverflowにも同じ問題があるようです。サイズを変更してみてください。灰色の背景は検索ボックスまで拡大しません。 これを修正するにはどうすればよいでしょうか。 ありがとうございます。

2 Answer


0


背景が幅100%のコンテナ内にあり、「

または ``

CSSで幅を設定しないと、この動作が発生します。 100%はブラウザのビューポートの100%になるためです。 これを固定幅に変更すると、固定幅を埋めるために伸びるはずです。


0


あなたがする必要があるのは、bodyタグに `display:inline-block`を設定することです。 スタックオーバーフローのサイトにこれを行う場合。 問題を修正します。

この方法は「シュリンクフィット」と呼ばれます。

これが問題のフィドルです。 DEMO +ご覧のとおり、divをスクロールすると、画面全体の幅が拡大しなくなります。

ここに問題のないフィドルがあります。 DEMO

これは、https://stackoverflow.com/questions/450903/make-css-div-width-equal-to-contents [divをそのコンテンツよりも大きくしない方法?]ただし、技術的には要素をスパンにする必要があります。 buti-oxaの答えは注目に値します。また、このメソッドを使用すると、要素を少なくとも2回フォーマットする必要があるため、コストがかかることに注意してください。 それは体に適用されているので、あなたの状況ではそれほど悪いことではないようです。