滚动条在浏览器和div边距0自动跳跃

我正在使用div＃wrapper margin: 0 auto来居中div，在这个页面上有滚动条，但是当它转换到没有滚动条的第二页时，它看起来像跳跃因为我猜没有滚动条。滚动条在浏览器和div边距0自动跳跃

<body> 
<div id="wrap"> 
<div id="wrapper"> 
.... 

#wrapper { width: 970px; margin: 0 auto; }

什么是最好的解决方案，这不会让它跳动？

来源

2011-06-15 cicakman

最好的解决方案是不要居中包装。滚动条是您浏览器的一部分，通过添加它可以重新设置HTML渲染区域的大小。 – 2011-09-20 22:50:23

我碰到的这几次，我发现最好的办法是强制每个页面上Ÿ滚动条，即使它不需要使用样式表：

html { overflow-y: scroll; }

这将意味着页面上始终有一个正确的滚动条，但会根据需要启用/禁用，并防止跳转。

来源

2011-06-15 12:55:58

它没有解决问题，如果SMB需要滚动条... – brabertaser19 2015-07-01 18:50:39

由于某种原因，它只适用于当我添加到身体的风格，而不是HTML – guillefix 2016-03-07 18:41:54

如果您不想在每个页面上强制使用Y滚动条，则可以使用视图端口宽度来计算边距。这停止了我的自动跳跃。

@media (min-width: 960px) { 
    .container { 
     margin-left: calc(50vw - 480px); 
     width: 960px; 
    } 
}

来源

2016-03-12 08:04:45 winry

向您的html标记添加计算的边距将在左侧创建一个边界，等于滚动条存在时的右侧滚动条。这将停止跳跃。

html { 
    margin-left: calc(100vw - 100%); 
}

Original Source

来源

2016-11-25 22:41:43 Darryls99

组HTML宽度为等于视口和关闭水平滚动，以避免出现水平滚动条时垂直一将扩展HTML。

html { 
    width: 100vw; 
    overflow-x: hidden; 
}

来源

2017-06-20 15:19:54

我希望我可以给这个代码1000分。我一直试图解决一个问题几个小时，这是解决方案。当我的网站（基于bootstrap）的方向是RTL时，我有一些奇怪的跳跃行为。在页面加载时，内容在最右边出现1/10秒，然后跳转到中心（应该如'margin：0 auto'），并应用延迟上的“col-md-3”宽度。这'css'解决了所有这些问题，为什么，不知道:-) – 2017-11-25 18:00:10

滚动条在浏览器和div边距0自动跳跃

回答

相关问题