0

固定幅のサイトがあるというちょっとした苦境に陥っていますが、画面全体を100％移動するには、2本の流動的な幅のバーが必要です。私は問題のサイトにかなり恐ろしいワードプレステンプレートを使用しています。設定を保存するたびに、設定に従ってコンテンツの幅が保存されます。この場合は900pxです。

サイト全体が900ピクセルであることに満足しています。100％必要なのはヘッダーバーとフッターバーだけです。これらのバー内の要素も900ピクセルにすることができ、画面の両側に色を拡張する必要があります。 。

問題のサイトはhttp://mysterybox.co/です。下の画像から、どのバーを拡張する必要があるかがわかります。誰かが私を正しい方向に向けることができれば、それは素晴らしいことです。

ミステリーボックスサイト

4

1 に答える 1

1

#containerヘッダーとフッターの両方に新しいコンテナーを作成し、それらをdivから取り出します。このようなものが機能します：

HTML 

<div class="header-wrapper">
  <div id="headerwidth">
   ....
  </div>
</div>

<div class="footer-wrapper">
  <div id="footer">
   ....
  </div>
</div>

CSS

.header-wrapper, .footer-wrapper {
 background-color:#000;
 margin:30px 0 40px;
}

#headerwidth, #footer {
 width:900px;
 margin:0 auto;
}
于 2012-01-02T19:50:00.760 に答える