Question

我可以按照说明在网页上设置粘性页脚

http://css-tricks.com/snippets/css/sticky-footer/

建议min-height:100%并且未设置高度

.page-wrap {
  min-height: 100%;
  /* equal to footer height */
  margin-bottom: -142px; 
}

但是，在其中一个页面中，我需要设置height:100% in。page-wrap来调整其子项的高度。设置高度：100％后，我的粘性页脚不起作用并显示在页面中间。

有没有办法在.page-wrap中将高度设置为100％来粘贴页脚？

Answer 1

从height:100%类

中删除container-fluid元素

.container-fluid {
 position: relative;
 min-height: 100%;
 /*height: 100%;*/ /*Remove the height and it will work fine*/
 width: 100%;
 border: 1px solid green;
}

<强> DEMO HERE

Answer 2

   .container-fluid 
   {
    position:relative;
    min-height: 100%;
    width:100%;
    border:1px solid green;
   }

这会将页脚放到页面底部。这样可以正常工作。

粘性页脚高度设置在包含元素

2 个答案: