Chrome Android机身高度:100%实际上比viewport长

3j86kqsm  于 12个月前  发布在  Go
关注(0)|答案(1)|浏览(185)

在Android上的Chrome上,我最近遇到了一个问题,即使我将主体高度和宽度设置为100%,我的页面的主体似乎比视口略长,导致事情看起来有点不对劲。
为了试图找到问题的根源,我将页面剥离到以下基本页面:

<!DOCTYPE HTML>
<html>
    <head>
        <style>
            *{
                box-sizing: border-box;
            }
            html, body{ 
                height: 100%;
                width: 100%;
                margin: 0px;
                padding: 0px;
            }
            body{
                border: 1px solid red;
            }
        </style>
    </head>
    <body>

    </body>
</html>

字符串
当在桌面上查看时,
x1c 0d1x的数据
当在Chrome上的Android上查看时,它看起来像这样



由于某些原因,页面的实际主体似乎比它设置的100%长,所以边框被切断了。看起来有大约2 px的差异,这并不多,但足以让我的设计看起来不太好。
我能做些什么来修复这个问题吗?或者这是Chrome(或我的手机!)中的一个错误?

wsewodh2

wsewodh21#

尝试将高度设置为100 svh
高度:100 svh;

相关问题