[wx·part]微信小程序通过positon:absolute布局解决元素浮动显示后，如何设置显示位置问题

前言：

今天决定“从操旧业”了，感觉自己被隔离世外一样。今天遇到一个严重的手机自适应问题，在开发微信小程序时，在微信开发者工具中通过一些绝对的写法。微信开发者工具上显示正确，但是在真机上显示位置出人意料。通过慢慢“敲锁”还是解决了问题，决定用小本本记录下来。

一、问题描述：

小二，“上图”。

想把“学习中”标签显示在scrollview控件的右上角。scrollview中的子元素body布局为水平线性布局。通过flex:1;设置右端显示区域为淡蓝色显示区域。将删除图标css类中添加margin-top: 50%;使删除图标垂直居中显示，就成了如图所示。
“学习中”标签无法设置到右上角，通过添加绝对margin-left:80rpx;后如图所示。

很遗憾超过了想要达到的位置。细细一想，即使在这里通过margin-left设置好位置后。在不同的手机上显示时，手机的宽度不尽相同。父级元素有通过%设置宽度的，写上绝对左边距后，后果不敢预料。

二、解决思路：

position:absolute;z-index:1;显示后的元素会脱离父级元素。和父级元素同级显示。通过right控制右边距，设置与父级元素同右边距，以达到显示效果。