这是我参与11月更文挑战的第5天，活动详情查看：2021最后一次更文挑战
因为热爱所以坚持~
前言
背景是这样的，产品即将上线，发现不同设备有一处样式不兼容，就很神奇！两个同样的div,只有一个其中一个样式会串。现在就来记录一下排查修改的过程吧！
思路
打开移动端的开发者模式，连上数据线(这就是所谓的插线调试),打开需要调试的app,在IE浏览器上的地址栏中输入：
edge://inspect/#devices
开始可能会出现这样的页面，没有什么内容：
接下来可以刷新浏览器，或者在app上做一些页面跳转之类的刷新操作：(用掘金示意如下)
(正常应该是这样的，不知道咋回事现在不好用了)正常效果是左侧是当前应用页面，右侧就是正常前端在浏览器调试的页面，可以看接口，可以看样式，可以看控制台输出等等
ps:查到原因了，这种调试只能是开发版，不能是release版，所以我一个也打不开！
修改
找到对应的DOM元素，修改相应的样式即可。
不兼容的效果大概是这样的：彩色小方块右边是期望效果，左边应该也和它一样才对！但是实际效果是只对适配的一种机型无误，换成其它品牌的机型就出现这种问题
其实看了样式发现就是一个margin-top的问题，本来想的是重新编辑一下这些元素的布局，这么一来就是大改，又因为马上上线了，时间很紧张。最后看前辈的解决方法就只是改动了margin-top的值，很神奇！我也在浏览器上调了对应的值，浏览器上的效果是可以的；移动设备也插线调了相应的值，效果就不对呀！
疑惑
具体数值使得一种型号设备样式正常，其它型号都不对！改了一个margin-top的数值，所有型号就都兼容了?这个还需要再研究研究！
