【报Bug】引入全局样式之后导致H5的右边的滚动条消失了，特别麻烦，使用起来极度不方便

操作步骤：

<template>  
  <view class="container">  
    <navigation-bar title="My Page" />  
     <!-- :style="{ height: scrollViewHeight + 'px' }" -->  
     <!-- #ifdef APP-PLUS -->  
     <view id="statusbar" class="status-bar"></view>  
     <!-- #endif -->  
     <!-- #ifdef APP-PLUS -->  
     <view class="box-bg fixedNavBar" style="top: 28px;">  
        <uni-nav-bar shadow left-icon="bars" leftText="" rightText="" title="同问" />  
     </view>  
     <!-- #endif -->  
     <!-- #ifdef H5 -->  
     <view class="box-bg fixedNavBar">  
        <uni-nav-bar shadow right-icon="list" leftText="" rightText="" title="同问" />  
     </view>  
     <!-- #endif -->  
     <view class="main">  
         <uni-list class="list">  
             <view class="context" v-for="(item, index) in myData">  
                      {{item.name}}  
             </view>  
         </uni-list>  
     </view>  
  <!--  <scroll-view class="my-scroll-view" :pull-down-refresh="true" @refresh="onRefresh">  

    </scroll-view> -->  
    <view class="footer center">  
        <view style="width: 85%;">  
            <textarea class="text" confirm-type="go" @confirm="addMessage" @input="inputData" @focus="onFocus" placeholder="快来问我吧，可多行输入，问题长度最多700字~"  
                      maxlength="700" v-model="content" />  
        </view>  
        <view style="width: 15%; padding-right: 5px; padding-left: 5px;">  
            <!-- <text class="mButton" @click="addMessage">发送</text> -->  
        </view>  
    </view>  
  </view>  
</template>  

<script>  
export default {  
  data() {  
    return {  
      // Your data here  
      scrollViewHeight: 500,  
      myData: [],  
      content:'',  
      keyboardHeight: 0,  
    };  
  },  
  mounted() {  
      // #ifdef APP-PLUS  
      uni.onKeyboardHeightChange(res => {  
        this.keyboardHeight = res.height;  
        console.log("键盘高度："+this.keyboardHeight + 200)  
      });  
      // #endif  
      this.initData()  
  },  
  methods: {  
      initData() {  
          let data = []  
          for (var i = 0; i < 20; i++) {  
            data.push({index: i, name: "第-"+i+"项"})  
          }  
          this.myData = data  
          console.log(this.myData)  
      },  
        onRefresh() {  
          // Refresh your data here  
          console.log("Refresh your data here")  
        },  
        //发送消息  
        addMessage (params) {  
            console.log("发送消息")  
        },  
        onFocus(e) {  
            console.log("----------------onFocus-----------------"+e.detail.height)  
            uni.$emit('scrollToBottom')  
        },  
        inputChange(e) {  
            console.log("--------inputChange-------------"+e.detail.height)  
        },  
        inputData(e) {  
            console.log("--------inputData-------------")  
            this.content = e.detail.value  
        }  
  }  
};  
</script>  

<style>  
.my-scroll-view {  
  overflow: auto;  
}  
.container {  
    display: flex;  
    flex-direction: column;  
    height: 100%;  
    width: 100%;  
    overflow-x: hidden;  
}  
.status-bar {  
    position: fixed;  
    display: flex;  
    z-index: 999;  
    flex: 1;  
    flex-direction: column;  
    height: 28px;  
    top: 0;  
    left:0;  
    right:0;  
    /* background-color: aqua; */  
}  
.fixedNavBar {  
    display: flex;  
    position: fixed;  
    justify-content: space-around;  
    width: 100%;  
    z-index: 999;  
    height: 44px;  
    flex: 1;  
    flex-direction: column;  
    background-color: aqua;  
}  
.footer {  
    position: fixed;  
    flex-direction: row;   
    bottom: 0;  
    right: 0;  
    width: 100%;  
    height: 70px !important;  
    overflow-x:hidden;  
    border-top: solid 1px #DDD;  
}  
.main{  
    /* #ifdef H5 */  
    top: 44px;  
    /* #endif */  
    /* #ifndef H5 */  
    top: 72px;  
    /* #endif */  
    bottom: 70px;  
    height: 500px;  
    position: relative;  
    display: block;  
    flex: 1;  
    /* overflow: hidden; */  
}  
.context {  
    height: 100px;  
    border-style:dotted;  
    border-width:1px;  
}  
.text {  
    display: inline-block;  
    padding: 8px 8px 8px 8px;  
    background-color: #FFFFFF;  
    height: 60px !important;  
    width: 70%;  
    line-height: 22px;  
    color: #000000;  
    border-radius: 10px;  
    font-size: 14px;  
}  
.mButton{  
    margin: 10px 15px 10px 10px;  
    background-color: #1E90FF;  
    color: #FFFFFF;  
    border-radius: 10px;  
}  
.center {  
    /* flex: auto; */  
    display: flex;  
    flex-direction: column;  
    justify-content: center;  
    align-items: center;  
}  
</style>

预期结果：

不会去影响开发者自己代码中本质的样式设置，开发者设置的样式优先于ui库，右边能够显示滚动条

实际结果：

引入的ui库样式优先级高于使用者设置的样式，导致基本的显示滚动条消失了，反而给开发带来了麻烦