在制作小程序的时候发现了一个问题，代码和效果如下。
// poster.js<view class="container" style="background-color: {{background_hex}}; height: {{height}}px" bindtouchend="play"> <text class="content" style="color: {{text_hex}};">{{ char }}</text> </view> |
// poster.css.container { display: flex; align-items: center; flex-direction: column; justify-content: space-between; background-color: #EEE;}.content { font-size: 700rpx; text-align: center; font-weight: bold; margin: auto;} |
实现功能就是单个汉字居中展示。但是在安卓机器下面，会出现向右偏移一定距离具体图片如下。
在安卓机下面，可以看到加粗的汉字会偏右。而下图中的显示结果，除了将css代码中的font-weight: bold; 去除掉之后，其余的代码没有改变，显示效果的话就会居中。
请问，这种情况应该怎么处理？ 在好几台安卓机下面都是这样的效果。 iOS下面没有任何问题。
请问这个是什么原因？