1

i like to have a background all over my website. Works fine while the content static. While using javascript to extend the content, the body element don't grow over the scrolling area. My question is similar to this question: Div height 100% and expands to fit content

Note: I've used a lots of floats and can not make a fixed background div, because my website gets inaccessible.

Need to solve this somehow. Maybe with JS ?

Html, Body
{
  width: 100%;
  height: 100%;
  background-color: #ffffff;
}

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

enter image description here

Update: Nathan Lee answer helped me. My problem is that the scroll-bar move the background and all my all other centered content stays in position.

body {overflow:auto;}
4

3 回答 3

3

添加overflow:auto;到你的身体。

body {overflow:auto;}

希望这可以帮助。

于 2013-05-15T13:06:19.577 回答
1

更改height: 100%为min-height: 100%;：

html, body
{
  width: 100%;
  min-height: 100%;
  background-color: #ffffff;
}

你告诉你body总是和窗口一样高，所以它实际上是这样运行的 - 不会扩展以适应文档的高度。使用 min-height 您可以让这种情况发生

在此处查看演示：http: //jsfiddle.net/meyertee/Lpgwa/

于 2013-05-15T13:12:02.613 回答
0

当您使用浮点数时会发生这种情况，是否有任何理由使用浮点数？尝试删除 float 并添加display: block;OR display: inline-block？

于 2013-05-15T13:08:53.260 回答