Issues with sizing of emojis/special characters

Hi all,

I am designing a website that incorporates a lot of emojis within the design. I inserted the emojis right into my paragraph blocks by using text wraps and copy/pasting in emojis from http://www.iemoji.com/. This process works great for desktop but I am running into issues on mobile and particularly on tablet. On these devices the sizing of the emojis changes drastically from that of its accompanying text, creating a very obvious flaw in the design. I am assuming that this has something to do with the iOS interpolating the emoji code, but I have no idea how I should go about adjusting this. I am hoping there is a way to make this adjustment while still keeping the whole paragraph block live text. I am essentially just looking for a way to modify the sizing of specific special characters within a paragraph block.

My read only link is https://preview.webflow.com/preview/grip-misguidance?preview=beba4c7311ed1752d82acaaf8326e2e0

url is http://grip-misguidance.webflow.io/

Thanks!

Hi @rimann, I haven’t tried this yet, but have you tried using ems? Maybe set your emoji to 1em and see if that changes the behavior for iOS devices.

Hey @thewonglv, I gave that a try but unfortunately gave me the same results.

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.