cover-view中显示开头几个文字样式不同然后文字空间与后面重合

想要实现的效果是模拟器这样的,但是真机上出现问题。主要的代码结构是这样:
<cover-view class=‘message-item’ wx:for="{{message_list}}">
<cover-view class=‘message-name’>{{item.userName}}:</cover-view>
{{item.messageContent}}
</cover-view>
