css父元素定位后子元素审查元素位置错乱

Question

父元素position:fixed写了一个遮罩层，里面的子元素审查元素位置错乱，在超出这个元素的位置还能定位到这个元素
<div style = {styles.toolstip}>
<div style = {styles.case}>

<div style = {styles.title}>直播平台授权</div>

</div>
</div>

.toolstip {
position: fixed;
left: 0;
right: 0;
bottom: 0;
top: 0;
width: 100%;
background-color: rgba(0,0,0, 0.3);
display: flex;
justify-content: center;
align-items: center;
}
.case {
width: 602;
height: 485;
background-color: #fff;
border-radius: 20;
}
.title {
width: 100%;
height: 95;
line-height: 95;
text-align: center;
font-size: 28;
color: #5e57ff;
border-bottom: 1px solid #ccc;
}
浏览器审查元素的时候 .title元素错位， 但是子元素去掉居中样式以后审查元素又正常了