IE / Edge не соблюдает абсолютное дно

Question

У меня довольно простая компоновка, и другие браузеры, кажется, справляются, но IE и Edge, похоже, игнорируют мое основание: 0 в абсолютном позиционном div.Я выполнил поиск по максимуму и минимуму и реализовал некоторые предложения, которые я нашел для подобных проблем (например, добавив left: 0 к абсолютному элементу), но, похоже, ничего не работает.

Любые предложения будут очень признательны!

.packagebox {
  margin: 0;
  display: table;
  min-height: 500px;
  position: relative;
}

.leftBox {
  width: 40%;
  display: table-cell;
}

.rightBox {
  width: 59%;
  display: table-cell;
  height: 100%!important;
  vertical-align: top;
  position: relative;
}

div.boxCTA {
  display: block;
  width: 100%;
  position: absolute;
  bottom: 0px;
}

div.boxCTA a {
  display: table;
  padding: 25px 0;
  width: 100%;
}

<div class="packagebox">
  <div class="leftBox"></div>
  <div class="rightBox">
    <h3 class="packageboxTitle">Lorem Ipsum</h3>
    <p class="price"><span>$100</span> $50 CAD</p>
    <div class="boxlist">
      <ul class="packageboxList">
        <li><a href="#">Lorem Ipsum</a></li>
        <li><a href="#">Lorem Ipsum</a></li>
        <li><a href="#">Lorem Ipsum</a></li>
        <li><a href="#">Lorem Ipsum</a></li>
        <li><a href="#">Lorem Ipsum</a></li>
        <li><a href="#">Lorem Ipsum</a></li>
        <li><a href="#">Lorem Ipsum</a></li>
        <li><a href="#">Lorem Ipsum</a></li>
        <li><a href="#">Lorem Ipsum</a></li>
        <li><a href="#">Lorem Ipsum</a></li>
        <li><a href="#">Lorem Ipsum</a></li>
        <li><a href="#">Lorem Ipsum</a></li>
      </ul>
    </div>
    <div class="boxCTA">
      <a href="#">Buy Now & Save</a>
    </div>
  </div>
</div>

Как это выглядит в IE / Edge: Как это выглядит везде: