- ベストアンサー
※ ChatGPTを利用し、要約された質問です（原文：CSS | 中央寄せと背景）
CSS中央寄せと背景：ウィンドウ幅超過時の背景表示と横スクロール制御について
このQ&Aのポイント
- CSSを使用してコンテンツの中央寄せを行う際に、ウィンドウ幅があるピクセル数を超えた場合に背景を出現させる方法について質問です。
- また、コンテンツ幅800px、inner-wrapper幅1000px、outer-wrapper幅1200pxといったページを作成する場合に、ウィンドウ幅が999pxまでは横スクロールバーを表示し、1000pxになった時点で横スクロールバーを非表示にする方法についても教えてください。
- bodyにoverflow: hiddenを適用すると横スクロール自体が表示されなくなってしまうため、別の解決策を探しています。
- salt_on_all
- お礼率56% (9/16)
- HTML
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
noname#137826
回答No.1
こんな感じでしょうか？ #innerwrapper の width を max-width に変更すると少し異なった振る舞いをします。どちらが意図するところに近いのか迷ったので、そちらも試してみてください。 ---(html)--- <body> <div id="outerwrapper"> outer wrapper <div id="innerwrapper"> inner wrapper <div id="content"> content </div> </div> </div> </body> ---(css)--- body { background-color: #F93; } #innerwrapper { background-color: #FFF; width: 1000px; margin: 0 auto; border: 1px solid #666; } #outerwrapper { background-color: #FFF; max-width: 1200px; margin: 0 auto; } #content { background-color: #39F; width: 800px; height: 600px; margin: 0 auto; }
お礼
ご回答ありがとうございました！ 近いところまではいっていたのですが、やっとたどりつけました。 2つめの質問もmax-widthとmin-widthの併用で、解決しました。 本当にありがとうございました！！