A.Casa A.Casa - 1 year ago 79
CSS Question

Positioning a div at the bottom of the page issue

i am working on this website and as you can see i have this

<div class="bt-op-item-builder-content">...</div>
(i setted a green border) at the bottom of every single page.

This works on Chrome, Safari, Microsoft Edge but not on INTERNET EXPLORER 11.

How can i move it at the bottom also on Internet Explorer 11?


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

Thanks in advice

PS: Some screens

Internet Explorer 11

Answer Source

If you update like this it will work

  • .btnav-container .bt-op-item .bt-op-item-builder's parent need to have position: relative so the absolute positioned element is relative to it

  • .btnav-container .bt-op-item .bt-op-item-builder need an absolute position for the bottom: 0px !important to work

  • .btnav-container .bt-op-item .bt-op-item-builder need left: 0 or else it start of screen

Updated CSS rules

.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;
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download