高度设置为100%但页面无法正确呈现

时间:2013-12-12 18:25:56

标签: css

以下是指向我的信息页的链接:http://mobile.sheridanc.on.ca/~vecanski/

我遇到的问题是高度设置为100%然后我仍然可以向下滚动并看到浅蓝色,即使页面上没有任何东西,除了浮动气泡。有谁知道为什么我能向下滚动?我也有渐变效果,这是代码:

  background: #4094d1; /* Old browsers */
  background: #4a97ce; /* Old browsers */
  background: -moz-linear-gradient(top,  #4a97ce 0%, #2687cc 22%, #1080cc 48%, #0c0c02 99%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4a97ce), color-stop(22%,#2687cc), color-stop(48%,#1080cc), color-stop(99%,#0c0c02)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #4a97ce 0%,#2687cc 22%,#1080cc 48%,#0c0c02 99%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #4a97ce 0%,#2687cc 22%,#1080cc 48%,#0c0c02 99%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #4a97ce 0%,#2687cc 22%,#1080cc 48%,#0c0c02 99%); /* IE10+ */
  background: linear-gradient(to bottom,  #4a97ce 0%,#2687cc 22%,#1080cc 48%,#0c0c02 99%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4a97ce', endColorstr='#0c0c02',GradientType=0 ); /* IE6-9 */

我不明白为什么渐变不会一直走,即使它是可滚动的,为什么它会在页面的末尾重新开始?

真的有两个问题:

  1. 如何删除页面的可滚动部分?
  2. 如果我要离开页面的可滚动部分,如何强制渐变延伸到最后而不是重新启动?

1 个答案:

答案 0 :(得分:1)

您可以使用浏览器检查元素找出这样的问题 顺便说一下,解决这个问题:

删除#bubbles padding:100px 0

overflow:hidden添加到#container