[CSS]横スクロール時にヘッダやフッタが切れてしまう時の解決方法

ヘッダやフッタがブラウザの横幅より広い際に、横スクロールするとヘッダとフッタが切れてしまうのを解決する方法を紹介します。 これはIE6などの旧式のブラウザだけでなく、Firefox3.6やChromeでも起きる現象です。 How to Resolve a Fluid Header/Footer Problem When the Window is Resized デモページ（不具合版） ※キャプチャはFirefox3.6（不具合の確認は横幅を小さくして） この現象が起きる条件は下記のようになります。 ヘッダとフッタのサイズは指定されていない。 →横いっぱいに広がる。 コンテンツエリアのサイズは指定されており、「margin:auto;」で中央に配置。 ブラウザのサイズはコンテンツエリアのサイズより小さい。 →ブラウザに横スクロールバーがでる。 期待される表示は、下記のようにコンテンツが中央

[ta1969]

ヘッダ切れ解決方法

[knightworks]

横スクロール時にヘッダやフッタが切れてしまう時の解決方法

[f503kk]

横スクロール時にヘッダやフッタが切れてしまう時の解決方法

[dreamily]

サイズを指定していないヘッダとフッタに「min-width」プロパティを使用して、コンテンツエリアと同じ幅を指定。

[jackie_nyan]

ヘッダとフッターをモニタ表示幅に自動で伸ばす

[boyasan]

min-width これもすぐ忘れる

[hinokamo]

背景が切れない

[billy-elliot]

"[css][webdesign][横スクロール時にヘッダやフッタが切れるときの解決方法]"

[o_hiroyuki]

横スクロール時にヘッダやフッタが切れてしまう時の解決

[rryu]

幅を指定しないとビューポートと同じ幅になるが、min-widthで最低幅を#contentの幅と同一にしておけば、スクロール時の横幅と同じになるので切れないように見えるという仕組み。

[tarchan]

＞サイズを指定していないヘッダとフッタに「min-width」プロパティを使用して、コンテンツエリアと同じ幅を指定します。

[y-kawaz]

「IE6は非対応・・・そこまでする必要はないでしょう。」＜いい時代になってきたｗ

[PSV]

　解決方法は簡単です。サイズを指定していないヘッダとフッタに「min-width」プロパティを使用して、コンテンツエリアと同じ幅を指定します。

[yuenana]

あるある。

[hatebu_zuka]

css

[nors]

http://www.impressivewebs.com/fluid-header-footer-problem/

[forcutie]

display:table 別パターン

[gonta02]

横スクロール時にヘッダやフッタが切れてしまう時の解決方法

[Donca]

✔ [CSS]横スクロール時にヘッダやフッタが切れてしまう時の解決方法