防止HTML出现滚动条时页面的抖动

weixin_33828101

于 2018-03-21 22:23:00 发布

阅读量989

点赞数

文章标签：前端 ViewUI

原文链接：http://www.cnblogs.com/chen8840/p/8620204.html

版权

<html>
<style>
    * {
        padding: 0;
        margin: 0;
    }
    body {
        font: 40px fantasy;
    }
    .container {
        width: 1200px;
        height: 300px;
        margin: 0 auto;
        background-color: red;
    }
</style>
<body>
    <div class="container">
    </div>
</body>
</html>

这样的布局当body出现滚动条时container会往左移动7px左右

为了消除这样的滚动，在.container上加入如下规则

padding-left: calc(100vw - 100%);

转载于:https://www.cnblogs.com/chen8840/p/8620204.html

weixin_33828101

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
防止HTML出现滚动条时页面的抖动

<html><style> * { padding: 0; margin: 0; } body { font: 40px fantasy; } .container { width: 1200px; height: 300px;...
复制链接

扫一扫