【报Bug】css 伪类 float app 端失效 且ios 端会使元素消失

示例代码：

<template>  
        <view class="wrapper">  
            <view style="float: right;">11111222</view>  
            <view class="text" :class="{checked:flage}">  
                <view class="btn" v-if="isShow" @click="flage=!flage"></view>  
                {{text}}  
            </view>  

            <!-- 获取完全展开高度的view  -->  
            <view class="text get-height-box"  id="text">  
                {{text}}  
            </view>  

        </view>  

</template>  

<script>  
    export default {  
        data() {  
            return {  
                flage: false,  
                isShow:false,  
                text: `浮动元素是如如果还有更一行。  
                浮动元素是如何定位的还有更一行 有还有更一有更一行 有还有更一行 有还 更行。  
                。`  
            }  
        },  
        onLoad() {  
            this.$nextTick(function() {  
                let _this = this  
                let query = uni.createSelectorQuery().select('#text');  
                query.boundingClientRect(function(data) {  
                    //单行行高 30  
                    console.log(data.height);  
                        if (data.height > 60) {  
                            _this.isShow = true  
                        }  
                    })  
                    .exec();  
            })  
        },  
    }  
</script>  

<style scoped>  
    .wrapper {  
        position: relative;  
        display: flex;  
        width: 800rpx;  
        overflow: hidden;  
        border-radius: 8px;  
        /* padding: 15px; */  
    }  

    .text {  
        font-size: 20px;  
        line-height: 30px;  
        overflow: hidden;  
        text-overflow: ellipsis;  
        text-align: justify;  
        display: -webkit-box;  
        -webkit-line-clamp: 2;  
        -webkit-box-orient: vertical;  
        position: relative;  
        color: #aaff00;  
    }  

    .get-height-box{  
        position: absolute;  
        -webkit-line-clamp: 999;/* 完全展开 */  
        z-index: -99;  
        background-color: #0066CC;  
        opacity: 0;  
    }  

    .text::before {  
        content: '';  
        height: calc(100% - 24px);  
        float: right;  
    }  

    .btn {  
        float: right;  
        clear: both;  
        /* margin-left: 10px; */  
        font-size: 16px;  
        border-radius: 4px;  
        color: #000000;  
        cursor: pointer;  
        background-color: #00CE47;  
    }  

    .btn::before {  
        content: '查看全部'  
    }  

    .checked.text {  
        -webkit-line-clamp: 999;  
    }  

    .checked.text::after {  
        visibility: hidden;  
    }  

    .checked.text .btn::before {  
        content: '收起'  
    }  
</style>  

操作步骤：

上面代码

预期结果：

app 端和 h5 端一样

实际结果：

app 端和 h5 端不一样