У меня проблемы с оформлением аккордеона. Результаты Chrome / IE / Firefox отличаются от IE11. Как я могу это исправить?
Я уже пробовал несколько вещей, например, удаление абсолютной позиции.
Вот мой HTML:
<uib-accordion close-others="oneAtATime ">
<div ng-repeat="menuElement in vm.menuElements" class ="parent-container" ng-init="parentIndex = $index">
<div uib-accordion-group is-disabled="false">
<uib-accordion-heading>
<div class="parent">
<i class="{{menuElement.iconClass}}"></i>
<a>{{menuElement.menu}}</a>
<i class="go-right {{menuElement.iconClass}}"></i>
</div>
</uib-accordion-heading>
</div>
</div>
И мой SASS:
.parent-container
.panel
background-color: transparent
border: none
.panel-heading
background-color: transparent
padding-left: 0px
height: 35px
.panel-title
width: 100%
.parent
align-items: center
display: flex
width: 100%
i
font-size: 2.2em
a
font-size: 14px
.go-right
position: absolute
right: 0px
Результат на Chrome / FF / Edge (что правильно):
Результат на IE:
Как видите, элемент, использующий класс 'go-right', корректен при использовании Chrome / FF / Edge. Однако при использовании IE результат не совпадает.
Я пытаюсь сделать все, чтобы решить эту проблему, но по какой-то причине IE не доволен 'position: absolute' из класса go-right. Обратите внимание, что все элементы в каждом элементе div должны быть выровнены по вертикали, поэтому я использую display flex.
Заранее спасибо, ребята.