0

ボディの背景画像とラッパーdivの背景色があります。ボディの高さを設定しておらず、ラッパーにmin-height：1000pxを使用しています。ただし、ラッパーの高さが1000px;の場合、ラッパーの背景色はボディの背景画像と同じになります。HTMLコード：

<body>
 <div id="wrapper">
  <div id="header">
    <div id="headercontainer">
      <div id="company"></div>
      <div id="tagline"></div>
      <div id="navigation"></div>
    </div>
  </div>
  <div id="pagecontainer1"></div>
  <div id="footer1"></div>
</div>

これがcssです：

body{
background:#E8EDF0;
    margin:0;
width:100%;
background-image: url(http://l1.yimg.com/a/i/ww/met/th/slate/gsprite_pg_slate_20100521.png);
background-repeat: repeat-x;
background-position: 0px -2335px;}
#wrapper{
background-color:#FFF;
min-height:1000px;
width:1008px;
margin:auto;
position:relative;
overflow:visible;
}

ラッパーのこの背景色の問題を修正するにはどうすればよいですか。

4

2 に答える 2

0

<div style="clear:both"></div>pagecontainer1 divに追加するだけです。いくつかの float div があると思うので、float をクリアするには float clear を使用するか、overflow:hidden; を使用できます。オーバーフローではなく:可視;

<div id="wrapper">
  <div id="header">
    <div id="headercontainer">
      <div id="company"></div>
      <div id="tagline"></div>
      <div id="navigation"></div>
    </div>
  </div>
  <div id="pagecontainer1">
    <div style="clear:both"></div>
  </div>
  <div id="footer1"></div>
  <div style="clear:both"></div>
</div>
于 2012-09-28T09:04:52.530 に答える
0

ページをコーディングした方法では、ラッパーが高さ全体をカバーすることはできません。したがって、これを行う最善の方法は、次のように全身の背景画像を作成することです。

灰色の領域##-----白い領域: 1008px-----###灰色の領域

幅 2000 ピクセル (またはそれ以上)、高さ 1 ピクセルにし、縦方向に繰り返します。

background:#E8EDF0 url(new-background-path.jpg) top center repeat-y;
于 2012-09-28T08:43:22.033 に答える