小程序兼容三星S8机型问题
发布于 4 年前 作者 juanlei 10443 次浏览 来自 问答
  • 当前 Bug 的表现（可附上截图）
  • 预期表现
  • 复现路径

改样式在其他如华为、iPhone、小米机型正常显示，但是在三星S8机型无法垂直居中显示

  • 提供一个最简复现 Demo

<view class=‘wrapper’ style=“width:80rpx;height:36rpx;border: 2rpx solid {{color}}”>

   <view class=‘container’ style=“color:{{color}};”>

       <view class=‘text’ style=“font-size:48rpx”>{{text}}</view>

   </view>

</view>

1 回复

.wrapper{

position: relative;

box-sizing: border-box;

}

.container{

position: absolute;

width: 200%;

height: 200%;

left: -50%;

top: -50%;

transform: scale(0.5, 0.5);

transform-origin: 50% 50%;

border-radius: 8rpx;

display: flex;

justify-content: center;

align-items: center;

overflow: hidden;

}

.text {

line-height: 16rpx;

width: 100%;

text-indent: 10rpx;

letter-spacing: 10rpx;

text-align: center;

}

回到顶部