关于定位

因为 BFC 的高度计算包含浮动元素，同时清除浮动元素也会让父元素撑开，所以可以实现父元素被子元素撑开的需求。

但是 position:absolute 或者 position:fixed 就不一样，它是脱离文档流的，而且不会计算被父元素计算在内，同时也没有办法像浮动一样被清除。

.son1 {
float: left;
margin-top: 50%;
margin-left: 50%;
transform: translate(-50%, -50%);
}

.son2 {
    width: 30px;
    height: 30px;
    float: left;
   /* margin-left: 48%;*/
    z-index: 20;
    background-color: #ffde00;
    border-radius: 50%;
    background-size: 90% 90%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 45% 45%;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC0AAAAsAQMAAADLiKN8AAAABlBMVEX///////9VfPVsAAAAAXRSTlMAQObYZgAAAJhJREFUGBkFwbF14CAABTDxXFCyQbxGOjYLHs2jMAIlBed/kh+UqeNa+kvd+qRtfXIvfdGXezOmdsjr+pQ8SlyhRP2Qpx2MeW/01RfuPSbazov6Lw9qAiUfyAHZYCwwFsiGkgNXDtR80BK4dx70lRdjjom8fVHytM0V9VA/9dCO6+PeSuiLvMZkTHnpUx76FNzTH+r0i+v5D+wNX8mIpFQYAAAAAElFTkSuQmCC');
}

son2元素没有紧挨着son1元素，因为transform的影响，去掉transform之后，可以紧挨着son1