我在一个网站上工作，我不知道如何解决这个问题。当页面加载和浏览器最大化时，底部栏在屏幕上，背景显示蓝色。
当网站被调整大小，浏览器底部的滚动条可以水平滚动时，div的背景会在screen

结束的地方被切断，在那之后它只是白色，而不是一直填充蓝色。
任何想法，我需要改变这一点？我假设该网站的身体需要的东西？我知道可能超级容易只是不能弄清楚。
谢谢
https://jsfiddle.net/hd9c76tz/
CSS：

* {
  box-sizing: border-box;
}

html {
  width: 100%;
  height: 100%;
}

body {
  background-color: #FFFFFF;
  box-sizing: border-box;
  color: #FFFFFF;
  font-family: "Lato", Helvetica Neue, sans-serif;
  font-weight: 300;
  margin: 0px;
  width: 100%;
  text-align: left;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

#content {
  background-color: #FFFFFF;
  color: #000433;
  font-size: 0px;
}

#content-block {
  width: 100%;
  background-color: #FFFFFF;
  padding: 20px 0px;
  font-size: 12px;
}

#content-headline {
  font-size: 55px;
  font-weight: 500;
  line-height: 55px;
  margin: 0 0 10px 0;
  text-transform: uppercase;
}

#content-item-container {
  width: 100%;
  font-size: 0;
}

#content-wrapper {
  max-width: 1460px;
  min-width: 1200px;
  padding: 0px 48px;
  margin: 40px auto 0 auto;
  text-align: center;
}

#facts-block {
  padding: 20px 0px;
  margin: 40px auto 0 auto;
  background-color: #EFF6FF;
  width: 100%;
  color: #000433;
  font-size: 0px;
  font-weight: 500;
}

#facts-block-content {
  padding: 0 0 0 20px;
  display: inline-block;
  vertical-align: top;
  height: 55px;
}

#facts-block-headline {
  font-size: 16px;
  margin: 0 0 14px 0;
  text-transform: uppercase;
}

#facts-block-text {
  font-size: 12px;
  font-weight: 400;
  text-transform: capitalize;
}

#facts-block-item {
  font-size: 0px;
  display: inline-block;
  margin: 0px;
  width: 25%;
  padding: 40px 0px;
  text-align: left;
}

#facts-block-wrapper {
  min-width: 1200px;
  max-width: 1460px;
  ;
  margin: auto;
  text-align: center;
  padding: 0px 48px;
}

#legal-content-paragraph {
  font-size: 14px;
  font-weight: 300;
  line-height: 25px;
  text-align: justify;
  margin: 0 0 40px 0;
  color: #000433;
}

字符串