CSS-переход портит стилистику группы Bootstrap в надстройке Excel

Question

Я разрабатываю надстройку панели задач Excel. У меня есть список вещей, которые нужно вставить в лист Excel, разделенных по разделам. Все работало, как и ожидалось, пока я не решил скрыть параметры в каждом разделе и сделать их свертываемыми, щелкнув заголовок раздела и добавив эффект перехода.

При использовании Office 365 Online в Chrome и Edge все идет как надо. К сожалению, в настольной версии Excel (Office 2019 версии 1808 использует IE11 в качестве средства просмотра веб-страниц для надстроек) он портит стилизацию группы списков: кажется, что цвет фона страницы сохраняется до тех пор, пока вы не наведите курсор мыши и это идет к ожидаемому поведению.

HTML

    <div class="list-container" *ngIf="accountingLists && accountingLists.length">

        <div class='list-header' (click)="accCollapsed = !accCollapsed">
            <i class="ms-Icon ms-Icon--ChevronDownMed" aria-hidden="true" [ngClass]="{ 'active': accCollapsed }"></i>
            &nbsp; <b>Accounting</b>
        </div>

        <div class="box list-group mt-0" [class.active]="accCollapsed">
            <a [routerLink]="[list.url]" *ngFor="let list of accountingLists"
                        class="list-group-item list-group-item-action">{{ list.label }}
            </a>
        </div>
    </div>

CSS

.list-header {
  cursor: pointer;
}

.list-header b {
  font-size: 1.05em;
}

.list-header i {
  font-size: .85em;
  color: rgb(77,101,214);
  transition: all 0.3s;
}

.list-header i.active {
  transition: all 0.35s;
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  transform: rotate(180deg);
}

.box {
  max-height: 0px;
  overflow-y: hidden;
  transition: ease-in 0.3s max-height;
}

.box.active {
  max-height: 400px;
  transition: ease-out 0.35s max-height;
}

В Chrome он корректно отображается после свертывания:

Непосредственно в Excel (IE11) он ошибается:

Количество фона, попадающего в список, кажется случайным.

После того, как вы наводите список мышкой, он становится обычным, как вы видите в Chrome.