chrome49中存在的各种隐晦的兼容问题

之前写过一篇chrome49兼容elementplus的文章,在后续公司研发中,买了一个vue2的项目,原项目组并没有兼容性要求,我们公司是需要兼容49的,在做了垫片后发现很多比较奇葩的问题,现在写下来,防止后人踩坑,目前列出来的都是遇到的,后续也会持续补充
关键的flex,原项目中写了大量的height:100%,后续接手我们选择进行了flex + flex-1 改造,高度通过flex-1继承,但是并没有删除原有的高度属性,最新浏览器中无异常,在49环境中,高度的优先级目测大于flex-1,flex-1不生效了,删除所有flex元素上的hegiht属性,页面正常
关键的grid,该项目中使用了flex+ivv-table的构建,在没有数据的情况下会导致宽度无限加上,不知道你们有没有遇到过,网上发现antd、element也有可能有类似问题,不知道有没有后续fixed,看到比较好的方法是设置表格父元素grid布局,之前也是用这个方法解决了,但是后来看chrome49根本不兼容这个属性,大概了解了下49应该是16年的版本,当时grid还在提案,还有子绝父相的方法,我这里因为样式不太适应,其实直接写死宽度也能解决

 /deep/ .ivu-table-wrapper {
    width: 100% !important;
	.ivu-table-header table, .ivu-table-body table, .ivu-table-tip table {
		width: 100% !important;
		table-layout: auto;
	}
 }

定位:在子元素未撑开父元素宽度时,最新浏览器的绝对定位不需要写死right:0,也能撑开,但是49环境必须写上left/right
新增axios 1.6.x 不兼容chrome49 建议写死版本
新增不支持16进制透明度设置 建议使用rgba

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值