ios横竖屏旋转，导致fixed元素升级问题

<div class="audio-brief-main" >
    <div class="audio-brief-img-outer"><img  class="audio-brief-img" /></div>
    <div class="audio-brief-word">
        <p class="p1">{{brief.name}}</p>
    </div>
</div>
<div class="audio-brief-box-bg"><div :style="'background:url('+brief.image+');background-size:100% 100%;position:relative;z-index:0;filter:blur(30px)'"></div><div class="overlayer"></div></div>
       

真实情况是audio-brief-main和audio-brief-box-bg本身是fixed元素。旋转成横屏的时候，需要改为absolute； 当ios手机测试横竖屏旋转的时候，发现audio-brief-box-bg会遮挡住上面的audio-brief-img-outer,但audio-brief-word又能显示。

最后给audio-brief-main加了定位，position:relative;z-index:9999999;问题搞定！

.audio-brief-main{
    width:100%;
    display:flex;
    align-items:center;
    position: relative;
    z-index: 999999999999;
}
@media screen and (orientation:landscape) {
	.audio-brief-box {
        position: absolute;
        z-index: 1;

	}
	.audio-brief-box-bg {
        position:absolute;
        z-index: 0;
    }
   
    
 }