之前这些小细节都在实践的时候给忽视了,或者都动态加载,框架的使用等因素的隐藏,变得不那么容易出现。
今天看到张鑫旭大牛的微博,觉得记录一下这个小问题的解决方案
<div style=" padding-left: calc(100vw - 100%);"> <div style="width:1200px;background:#ccc;height: 1000px;margin:0 auto;"></div> </div>
加了这句话就不会出现闪动问题,因为这样计算左边总会预留出来滚动条的宽度回没有滚动条为0;
100vw
相对于浏览器的window.innerWidth
,是浏览器的内部宽度,注意,滚动条宽度也计算在内!
而100%
是可用宽度,是不含滚动条的宽度。但是calc还是有兼容问题,支持主流浏览器,记得加上内核使用。