0

私のウェブサイトの上に垂直に引き伸ばされた中央の背景画像を持ちたいです。中央の画像を移動するスクロールバーがない間は完全に機能しますが、マージン: 0 auto はそのままにしておきます。コンテンツが背景画像と一致しなくなりました。

Html, Body
{
  width: 100%;
  height: 100%;
  background: url('../Images/page-bgr-top.png')
              center top repeat-x;
  overflow: auto;
}

Body {
  background: url('../Images/page-bgr-content.png')
              center top repeat-y;
  display: block;
  overflow: scroll;
}

#Main-Page
{
  width: 900px;
  margin: 0 auto;
  height: 100%;
  display: none;
}

background-imageとoverflow: autoonを設定して別の解決策を試してみて、#Main-Page私のウェブサイトで厄介なスクロールバーをいくつか取得してください。

4

2 に答える 2

0

ジャバスクリプトで解決。スクロールバーの幅を計算し、中央の要素のオフセットに追加します。

于 2013-05-16T14:30:21.477 に答える
0

これは、html と body に追加する CSS が多すぎるためです。

 Html, Body
        {
          /*width: 100%;*/ removed 
          height: 100%;
          background: url('../Images/page-bgr-top.png')
                      center top repeat-x;
          /*overflow: auto;*/ removed 
        }

        Body {
          background: url('../Images/page-bgr-content.png')
                      center top repeat-y;
          display: block;
          /*overflow: scroll;*/ removed 
        }

        #Main-Page
        {
          width: 900px;
          margin: 0 auto;
          height: 100%;
          display: none;
        }
于 2013-05-15T16:30:46.613 に答える