将 div 定位在页面问题的底部

【问题标题】：Positioning a div at the bottom of the page issue将 div 定位在页面问题的底部
【发布时间】：2016-11-21 23:57:12
【问题描述】：

我正在处理这个website，你可以看到我有这个

<div class="bt-op-item-builder-content">...</div>（我设置了一个绿色边框）在每一页的底部。

这适用于 Chrome、Safari、Microsoft Edge 但不适用于 INTERNET EXPLORER 11。

如何在底部移动它也在 Internet Explorer 11 上？

CSS：

.bt-op-item-content .builder-custom-op_bt_6641.bt-op-item-builder .bt-op-item-builder-content {
padding: 0px 0px 15px 0px;
}

感谢您的建议

PS：部分画面

Internet Explorer 11

【问题讨论】：

请分享你的css代码

标签： css internet-explorer-11

【解决方案1】：

如果你像这样更新它会起作用

.btnav-container .bt-op-item .bt-op-item-builder 的父级需要有position: relative，所以绝对定位的元素是相对于它的
.btnav-container .bt-op-item .bt-op-item-builder 需要一个绝对位置，bottom: 0px !important 才能工作
.btnav-container .bt-op-item .bt-op-item-builder 需要left: 0 否则它会开始屏幕

更新的 CSS 规则

.btnav-container[data-fullscreen-scroll=yes] .bt-op-item .fp-tableCell .bt-op-item-content {
    min-height: 100%;
    position: relative;          /*  added    */
}

.btnav-container .bt-op-item .bt-op-item-builder {
  display: block;
  position: absolute;            /*  changed  */
  left: 0;                       /*  added    */
  z-index: 1;
  width: 100%;
  margin: 0;
  padding: 0;
}

【讨论】：