关于vue项目去除margin和padding后设置元素width和height为100%后,出现滚动条问题(移动端)
bug点,这个页面设置100%(100vw和100vh)。页面出现抖动。

经过一番检察,原因出现在,vue项目自动添加的一个div上。就是body里的最后一个。如果选中这个元素,右键删除它。页面就不会抖动了。

说不定,这个元素还有什么用,所以不考虑有js删除。后来想到把他设置成position为fixed。让他 脱离文本流。
一看最外层的div没有class和id不好选中。但是发现子元素有,所以我们把子元素都设置成fixed就行了。
只要在你的重置样式里,加上这段css就可以了。
#trans-tooltip,#tip-arrow-bottom,#tip-arrow-top{
position: fixed;
z-index: -9999;
}
加上后,就不会出现上面抖动的问题了。
------------------------------------------------------------------------------
补充: 后来发现上文中的元素,是一个chrome插件造成的!就是 百度翻译 这个插件.

把这个插件关掉就不会出现 body里的 最后一个 div 了。 也是醉了,到现在才发现!

关于vue项目去除margin和padding后设置元素width和height为100%后,出现滚动条问题(移动端)的更多相关文章
- VUE项目中使用this.$forceUpdate();解决页面v-for中修改item属性值后页面v-if不改变的问题
VUE项目中使用this.$forceUpdate();解决页面v-for中修改item属性值后页面v-if不改变的问题:https://blog.csdn.net/jerrica/article/d ...
- 关于margin、padding 对内联元素的影响
内联元素和块级元素的区别是新手必须要掌握的知识点.大家可能平时注意块级元素比较多.所以这里重点让我们来讲讲常见的width height margin padding 对inline元素的影响. 测 ...
- vue项目Windows Server服务器部署IIS设置Url重写
1.将vue项目使用npm run build命令打包后将dist文件夹内的文件全部拷贝到服务器. 2.IIS添加应用程序池,.NET CLR版本选择无托管代码 3.添加网站,应用程序池选择刚刚添加的 ...
- 浅谈Margin和Padding值设置成百分数的布局
转自:问说网http://www.uedsc.com/discussion-margin-and-padding-values.html Margin和Padding是我们在网页设计经常使用到的CSS ...
- CSS3: box-sizing & content-box 属性---元素的border 和 padding 影响内容的 width 和 height解决方案
/* 关键字 值 */ box-sizing: content-box; box-sizing: border-box; /* 全局 值 */ box-sizing: inherit; box-siz ...
- vue-cli新建vue项目安装axios后在IE下报错
使用脚手架新建了一个vue项目,可以在IE9+浏览器运行,但是在添加了axios后,在IE下就报错了 首先是安装axios,在命令行执行: $ npm install axios -s //执行命令, ...
- 用margin还是padding
用margin还是用padding这个问题是每个学习CSS进阶时的必经之路. CSS边距属性定义元素周围的空间.通过使用单独的属性,可以对上.右.下.左的外边距进行设置.也可以使用简写的外边距属性同时 ...
- vue项目中图片预览旋转功能
最近项目中需要在图片预览时,可以旋转图片预览,在网上找了下,发现有一款功能强大的图片组件:viewerjs. git-hup: https://github.com/fengyuanchen/view ...
- 网页CSS中*{margin:0; padding:0;}有什么用
* 这东西叫“通配符”用来匹配页面上所有元素.*{margin:0; padding:0;} 像 2L 所说,body ,ul, li ,p,h1~h6,dd,dt 等……都有默认的margin 或p ...
随机推荐
- mysql案例~关于linux服务器本身的优化问题
简介:mysql服务优化分为 1服务器本身的优化 2mysql本身的性能优化 今天咱们来讨论下服务器本身的优化性能 一 参数的优化简介 1 文件系统的选择 Linux 常用文件系统: ext3, ex ...
- BootstrapValidator 解决多属性被同时校验问题
问题描述:在使用bootstrapValidator插件校验表单属性,当表单属性过多需要每行并列多个属性 ,会出现校验第一个属性,发现整行被校验的效果 ,这不是我们工作想要的效果.如图: 问题分析:因 ...
- 前端-----html(1)
基本结构 Doctype Doctype告诉浏览器使用什么样的html或xhtml规范来解析html文档 <!DOCTYPE html> bead标签 Meta 提供有关页面的元信息,例: ...
- 发布逸出 java this 逸出【转】
转自:http://blog.csdn.net/joker_zhou/article/details/7322801 (1)发布:发布是指将一个对象,使其引用储存到一个其他代码可以访问到的地方,在一个 ...
- oracle12.2.1 坑
1.ORA-28040: No matching authentication protocol 解决:在Oracle用户(不是grid用户)下,将$ORACLE_HOME/network/admin ...
- Configuring Automatic Restart of an Oracle Database
https://docs.oracle.com/cd/E11882_01/server.112/e25494/restart.htm#ADMIN12708
- 基于ATT和CK™框架的开放式方法评估网络安全产品
场景 提供有关如何使用特定商业安全产品来检测已知对手行为的客观见解 提供有关安全产品和服务真实功能的透明度以检测已知的对手行为 推动安全供应商社区增强其检测已知对手行为的能力 地址 https://a ...
- Windows Server 2008 R2忘记密码导致无法修改密码
其实有个记住密码的工具还是简单的,登陆系统后,CMD输入命令: net user administrator NewPassword 新密码即时生效
- 国产 WEB UI 框架 (收费)-- Quick UI,Mini UI
国产 WEB UI 框架 (收费)-- Quick UI,Mini UI : http://www.uileader.com/ http://www.miniui.com/
- 武汉倍特威视系统有限公司 --- 安全帽识别|烟火识别|智慧工地|BVS智能视频分析
武汉倍特威视系统有限公司 --- 安全帽识别|烟火识别|智慧工地|BVS智能视频分析 http://www.betvsys.com/