Emoji rendered in Chrome have different widths tha

2019-03-29 13:31发布

I have a page with an emoji followed by a space and some text. For example, "

2条回答
看我几分像从前
2楼-- · 2019-03-29 14:01

What I would do is add another span within the .friends span that contains the emoji, have it use a right margin, and not have a space after it:

.friends { 
  font-family: Helvetica, Arial, sans-serif; 
}

.friends span {
  margin-right: 10px;
}
<span class="friends"><span>                                                                    
查看更多
迷人小祖宗
3楼-- · 2019-03-29 14:02

I had the same issue, and found out that it happened on non-retina screens only.

To fix it, we applied a margin through a media-query like this:

<span class="friends"><span class="emoji">                                                                    
查看更多
登录 后发表回答