如何使背景叠加图像完全重复CSS？

Question

我的wordpress网站http://casper-creations.com上有多个背景图片，一个是背景图片，另一个是顶部的透明对角线图案，它工作正常但是如果你看起来不会在整页上重复仔细地在第一页上它似乎只有一半下来，你可以在这个页面上看得更清楚http://casper-creations.com/weddings-2/

这是我的CSS，我已经重复了，所以不太确定为什么它不重复页面的全长...任何想法？

...谢谢

html {
  overflow-y: scroll;
  font-size: 100%;
  overflow-y: scroll;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  background: #c2e8eb url(http://casper-creations.com/wp-content/themes/responsive/core/images/bg-cloud.jpg) repeat-x;
}
body {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-size: 13px;
  line-height: 1.5em;
  background: url(http://casper-creations.com/wp-content/themes/responsive/core/images/bg-diagonal-pattern.png) repeat;
}

Answer 1

这是因为这段代码http://take.ms/Nixqs

html, body {
    height: 100%;
}

当您将身体设置为100％且background-attachment: fixed图像重复时，只要...身高，所以只有整个窗口的100％。删除它，一切都应该没问题。

这是image with working example

Answer 2

你在身体和HTML上有不同高度的问题。只需min-height: 100%;到身体选择器。

body {
min-height: 100%;
}

Answer 3

如果没有办法编辑css我有一个更好的方法来完全重写身体和html标签的CSS，所以有一个多个背景，顶部的对角线和下面的云