transform 中含有 position: fixed 失效的问题解决

原代码是这样的

.down-icon {
    width: .27rem;
    height: 0.27rem;
    border-top: .02rem solid #6D3942;
    border-left: .02rem solid #6D3942;
    transform: rotate(45deg);
    position: fixed;
    left: 0;
    bottom: 0.4rem;
    left: 0;
    right: 0;
    margin: auto;
}

结果没有任何反应，其中的transform: rotate(45deg);并没有管用

解决办法：


将position: fixed;放在父元素内，添加一个子元素transform: rotate(45deg);放在子元素内

.down-icon {
    width: .27rem;
    height: 0.27rem;
    position: fixed;
    left: 0;
    bottom: 0.4rem;
    left: 0;
    right: 0;
    margin: auto;
    i{
      display: block;
      width: 100%;
      height: 100%;
      border-top: .02rem solid #6D3942;
      border-left: .02rem solid #6D3942;
      transform: rotate(45deg);
    }
}

此时效果可以实现