Html 页脚在布局文件中粘贴不正确

所以我想在我的网站上有一个页脚，但它似乎并没有粘到我的关于页面的底部。具体来说，文本会出现在底部，但是如果添加背景或装饰性的东西，你会看到页脚实际上在页面的中间。

它在我的主页上运行得很好，但不管出于什么原因，它都不会出现在“关于”页面上

我使用Rails作为后端，因此页脚在布局文件中

关于页面（页脚未粘住的位置）

---

如果我正确理解了您的需求，那么您应该使用css

fixed属性。

尝试类似的方法

.myFooter {
   position: fixed;
   bottom: 0px;
}

---

这将保留您将该类应用到视图底部位置的任何标记。

只需将

position:absolute

添加到页脚，宽度为100%，如下所示：

#footer {
    position:absolute;
    width:100%;
}

下面是一个包含上述代码的JSFIDLE：

---

这就解决了

哪个div是footer div？很抱歉，我删除了它以上载没有footer的网站，我只是将其添加到上面的源代码中。但还是不行。我试过了，但我不想要一个固定的，总是在框架内的。对不起，我应该补充一下，我已经做了所有这些事情。我在我的13个“屏幕”的框架的末尾得到它，但是它在页面的中间，即使我将它设置为绝对和do-{页脚}位置：绝对；底部：0px；}。

// Place all the styles related to the Pages controller here.
// They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/
p{
color: rgb(51, 51, 51);
display: block;
font-family: Roboto, sans-serif;
font-size: 21px;
font-weight: 100;
height: 90px;
line-height: 30px;
margin-bottom: 10px;
margin-left: 0px;
margin-right: 0px;
margin-top: 30px;
text-align: center;}

p, h1 { margin: 0 }

.window {
    height:700px;
    width:100%;

    //border-top: solid 1px #000; //temp test
}
.full{
    width:100%;

}

.main-home {
 background: url('http://i58.tinypic.com/2v34yub.jpg') no-repeat center center;
 background-size:cover;
}

.main-about {
    background: url('https://static.pexels.com/photos/1440/city-road-street-buildings.jpg') no-repeat center center;
    background-size:cover;

}


.secondary-home {
background:url('http://theabf.org/sites/default/files/nocredityosemite.jpg') no-repeat center center;
background-size:cover;
height:500px;
}

.window-support {
padding: 80px 0;
text-align: center;
}

.content {
    top:225px;
  position:relative;
  text-align: center;
  color: white;
}

h1.headline {
  font-family: 'Roboto', sans-serif;
  font-weight: 100;
  font-size: 50px;
}

h2.headline {
font-family: 'Roboto', sans-serif;
font-weight: 100;
font-size: 35px;
}


.btn.sharp {
border-radius:0;
border:none;
font-size: 14px;
}

.menu-icon {

    top:30px;
    left:30px;
    position:absolute;
    margin: 0;

}

.col-centered{
    float: none;
    margin: 0 auto;
}

.halfBack {
    width: 50%;
    position:absolute;
    height:500px;

}

.grid-text {
    padding-top:205px;
}

#abt-grid-3 {
   background: url('https://paulkporterphotography.files.wordpress.com/2015/04/20141210-distillery-31.jpg') no-repeat center center;
   height:500px;
    background-size:cover;
}

#abt-grid-1{
    background:url('https://i0.wp.com/upload.wikimedia.org/wikipedia/commons/1/14/1_yonge_street_toronto_winter_2010_panorama.jpg') no-repeat center center;
    height:500px;
    background-size:cover;

}
#abt-grid-2{
    background: url('http://ryersonbuilds.ryerson.ca/wp-content/uploads/2013/12/X6C61871.jpg') no-repeat center center;
    height:500px;
    background-size:cover;
}

#grid-long {
    background: url('https://ksulkski.files.wordpress.com/2011/11/istock_000000734318toronto_large.jpg') no-repeat center center;
    background-size: cover;
    height:500px;
}



.footer {
    background-color: #f9f9f9;
    border-top: solid 1px #F5F5F5;
    padding: 40px 0 30px 0;
    text-align: center;
    color: #ccc;
}

.myFooter {
   position: fixed;
   bottom: 0px;
}

#footer {
    position:absolute;
    width:100%;
}

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

body {
position:absolute;
min-width:100%;
min-height:100%;
}