在使用rem作為單位時，移動設備上瀏覽器滾動條不占內(nèi)容寬度，所以box1和box2可以剛好處于一行，然而在pc端由于滾動條占用寬度，所以box1和box2無法處于同一行，請問該如何解決這個bug？在繼續(xù)使用rem單位的前提下正常的移動端頁面：有滾動條的pc頁面：<style media="screen"> html, body, div{ padding: 0; margin: 0; } html{ font-size: calc(100vw/7.5) } .wrapper{ font-size: 0; } .box1{ display: inline-block; width: 3.75rem; height: 200px; background-color: red; } .box2{ display: inline-block; width: 3.75rem; height: 200px; background-color: blue; } .overflow{ height: 100vw; background-color: grey; } </style> <meta name="viewport" content="width=device-width"> </head> <body> <div class="wrapper"> <div class="box1"> </div> <div class="box2"> </div> <div class="overflow"> </div> </div> </body>
pc端滾動條bug如何解決？
料青山看我應如是
2018-12-20 14:11:29
