页脚神秘的差距

时间:2015-06-09 02:01:33

标签: html css html5 css3

更改站点周围的页脚,并且很难尝试解决为什么我在站点的页脚中出现间隙。希望拥有带有白色背景的.footer_container。我有一个.aux类,有一些额外的版权和联系信息保存在页脚容器中,但没有从页脚容器中携带白色背景颜色?我错过了什么吗?可能有些东西正盯着我,我只是忽略了? 任何帮助将不胜感激。

网站位于[此处] [1]

CSS

#footer_container {
    position: relative;
    clear: both;
    bottom: 0;
    width: 100%;
    height: 216px;
    padding: 10px 0;
    background: #fff;
}

.container_16 {
    margin-left: auto;
    margin-right: auto;
    width: 960px;
}

.container_16 .grid_4 {
    width: 220px;
}

#footer_container footer nav li {
    margin: 0 5px
}

#footer_container footer nav li a {
    display: block;
    margin: 0 -5px;
    padding: 2px 5px;
    color: #222222
}

#footer_container footer a:hover {
    background-color: #fbfed9;
    color: #222222
}

#footer_container footer #footer_nav_container {
    overflow: hidden;
    background-image: ;
}

#footer_container footer #footer_teaser {
    position: relative;
    height: 141px;
    background:#f7f7f7;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

#footer_container footer nav li {
    margin: 0 5px;
}

#footer_container footer .aux {
    clear: both;
    padding: 7px 5px;
    margin: 10px 10px 24px;
    border-top: 1px dotted #9d9d9d;
    color: #222222;
    font-family: "Apercu Regular", Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 9px;
    line-height: 12px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

#footer_container footer .aux a {
    margin: 0 -3px;
    padding: 1px 3px;
}

#footer_container footer .aux div {
    float: left;
    white-space: nowrap;
}

#footer_container footer .aux .contact {
    float: right
}

#footer_container footer .aux .contact div {
    margin-left: 16px
}

#footer_container footer .aux .contact .cta {
    font-family: "Apercu Bold", Arial, Helvetica, sans-serif;
    font-weight: bold
}

2 个答案:

答案 0 :(得分:2)

需要进行两项更改。

首先禁用padding-bottom: 40px类的.page

.page {
  display: block;
  /* padding-bottom: 40px; */
  border-bottom: 1px solid;
  margin-bottom: 10px; }

并禁用`#footer_container'的强制height: 216px格。

#footer_container {
    position: relative;
    clear: both;
    bottom: 0;
    width: 100%;
    /* height: 316px; */
    padding: 10px 0;
    background: #fff;
}

答案 1 :(得分:0)

<footer>没有背景资料。 #footer_nav_container上有一个白色背景,但.aux div是<footer>的孩子,位于#footer_nav_container下方,所以它也没有背景应用于它。我相信用简单的

将白色背景应用于页脚
footer{
background-color:#FFF
}

将弥合差距