CSS:滚动时背景图像不填充 - redux

Question

我正在寻求帮助，试图解决我的背景图片填充问题。我想要一个粘性页脚，我终于弄明白了，但现在如果我在一个较小的窗口中查看我的网站然后向下滚动，我的背景图像就会消失。我知道这是因为我的高度设置为 100%，这使得我的图像基于初始视口(viewport)大小，但我似乎无法实现任何类型的修复。

这是我正在处理的站点(仍在开发中):http://student.plattsburgh.edu/stipl001/index.html .

问题最好在小窗口中查看此页面时查看:http://student.plattsburgh.edu/stipl001/resume.html .

我已经阅读了各种网站上的许多帖子，试图找出答案(包括这篇文章:CSS: background image does not fill when scrolling)，但我没有任何运气。我尝试在 css 中设置我能想到的所有不同的背景属性，包括一些较新的属性。然后我尝试了 overflow 属性，但它只是隐藏了我所有的文本或创建了一个奇怪的滚动条，使我的文本在标题上滚动。我还尝试将我的页面背景从 body 移动到 html，将我的容器背景从容器移动到 body，但它没有改变任何东西，所以我一定是做错了什么(也许我有两个背景图像要处理？ ).

我只是一个编码新手，并且一直在自学，所以我非常感谢关于哪种修复方法最适合我的网站的具体建议，以及我如何着手实现它。在这个问题上直接花了大约 10 个小时之后，我已经束手无策了。

非常感谢!

Answer 1

只需将 min-height:100% 更改为 min-height:1092px(图像的高度)就可以了...

编辑:

之前的回答有点太快了，在再次查看代码后我注意到错误是由 float 列引起的:如果你 float 一个元素，容器元素将不会继承 float 元素的高度 - 那是为什么高度设置为初始窗口的 100%，并且在内容列变长时不展开。这可以通过在 #container 中添加一个额外的元素来解决，在 #rightcolumn 之后，上面带有 clear:both - 这将强制父元素接管其内容的高度。

参见 http://jsfiddle.net/uS7Ba/1/一个简化的例子，包括改进的固定页脚。

希望对你有帮助