0

960グリッドシステムでウェブサイトをデザインし、以下のようにヘッダーとフッターにCSSを介して背景画像と代替色を適用しました。

html {
height: 100%;
background: url(../images/htmlbg1.jpg) repeat-x;
} 

body {
font-family:Geneva,Arial,Helvetica,sans-serif; font-size:12px;
margin:0;
width:100%;
height: 100%;
background:url(../images/headerdrbg.jpg) repeat-x 0 0;
}

footer { 
width:100%; padding:12px 0px; 
background:#404040 url(../images/footertop1.jpg) repeat-x 0 0;
color:#808080; 
}

ほとんどのブラウザで正常に動作しています。小さな画面でも見栄えがします。しかし、水平方向にスクロールすると、背景画像(つまり、headerdrbg.jpgとfootertop1.jpg)が表示されません。添付画像をご覧ください。スクロールバーを640x480pxで水平に移動した後のフッターのスクリーンショット

解決策を見つけるのを手伝ってください。前もって感謝します。

4

1 に答える 1

0

960 GSを使用している場合は、に最小幅があるため、この問題は発生しないはずbodyです。これを削除していないことを確認するか、レイアウトが960pxより広い場合は値を変更してください。

/*
  Forces backgrounds to span full width,
  even if there is horizontal scrolling.
  Increase this if your layout is wider.

  Note: IE6 works fine without this fix.
*/

body {
    min-width: 960px;
}
于 2012-06-16T02:55:46.007 に答える