一起使用Bootstrap 4类时，过渡轻松性不适用于悬停

Question

使用angular js和bootstrap-并且当div的高度增加时，悬停时过渡过渡不起作用。

<div class="sidebar-list-item customHeight"><a ui-sref-active="active" ui-sref="home.dashboard.usermaster" class="sidebar-link text-muted"><span>Products</span></a>
      <ul class="sidebar-menu list-unstyled border-left border-primary border-thick">
        <li ng-repeat="product in prod" class="sidebar-list-item"><a ng-click="ctrl.getProduct(product)" class="sidebar-link text-muted pl-lg-3">{{product}}</a></li>
      </ul>
    </div>

customHeight类

.customHeight {
  overflow: hidden;
  height: 52px;
  transition: height .5s ease-in-out 0.5s;
}
.customHeight:hover {
  overflow: hidden;
  height: auto;
}

自动转换不适用于自动高度功能。