html – 当滚动条出现时,防止居中的布局移动其位置

概述我的页面布局看起来 something like this： <style type="text/css">#content-wrap{ margin: 0 auto; width: 800px;}</style><div id="content-wrap"></div> 您会注意到，当垂直滚动条出现时，content-wrap div会将其位置移位。一种情况是当浏览 我的页面布局看起来 something like this：

<style type="text/CSS">#content-wrap{    margin: 0 auto;    wIDth: 800px;}</style><div ID="content-wrap"></div>

您会注意到，当垂直滚动条出现时，content-wrap div会将其位置移位。一种情况是当浏览器开始逐渐呈现页面而不显示垂直滚动条，然后确定需要滚动条，因为内容高于“fold”。这将div向左移动10px左右。

什么是最好的方式来解决这个问题，而不强制浏览器总是显示滚动条？

解决方法 恐怕解决这个问题的最好方法是强制使用HTML {overflow-y：scroll;}随时可以看到滚动条。您所遇到的问题是，当出现滚动条时，“可用区域”会缩小为10像素。这导致您左侧的计算余量缩小到滚动条宽度的一半，从而将居中的内容稍微偏移到左侧。

可能的解决方案可能是使用JavaScript来计算边距，而不是使用margin：0 auto;并以某种方式补偿滚动条出现时的“丢失”像素，但是我恐怕会变得凌乱，并且在计算和应用新的边距时内容可能会移动一点点。

总结

以上是内存溢出为你收集整理的html – 当滚动条出现时,防止居中的布局移动其位置全部内容，希望文章能够帮你解决html – 当滚动条出现时,防止居中的布局移动其位置所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。