使用display:flex时垂直水平居中不准确
用‘px’做单位时
css
.checkout-all {
width:24px;
height:24px;
border:1px solid #e5e5e5;
border-radius:50%;
display:flex;
justify-content:center;
align-items:center;
}
.checkout-spot {
width:12px;
height:12px;
background:#2d9aff;
border-radius:50%;
}
html
<view class="checkout-all checkout-spot">
<view class="checkout-spot"></view>
</view>
用rpx做单位时
css
.checkout-all{
width: 46rpx;
height: 46rpx;
border: 1px solid #e5e5e5;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
.checkout-spot{
width: 24rpx;
height: 24rpx;
background: #2d9aff;
border-radius: 50%;
}
}
问题:用rpx做单位时,是不是感觉有点没居中