粘性引导页脚在响应中覆盖页面内容

Question

                 .....                  

    <div class="container">
    ......
    </div>
    </div> <!-- End -Wrap -->
    <div id="footer">
        <div class="container">
                ....
          </div>



html {
  position: relative;
  min-height: 100%;
}
body {
  position: relative;

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

[！[IN响应（重叠）] [1]] [1]     [！[在网页] [2]] [2]

  [1]: https://i.stack.imgur.com/itr4Y.png
  [2]: https://i.stac

k.imgur.com/8OXpa.png

我添加了屏幕截图。它正在网页中工作，但重叠是响应。给页脚的高度很重要。