Descender and ascender are not aligned

Hi all,

This has been an ongoing issue with our new Design system. The space that a descender in the type box is not aligned, which causes the icons look misaligned with the text. I tried everything even making the line height bigger but it just looks proportionally wrong.

I attached an example of what it looks like at the moment as you can see the spacing in ascenders is totally different to descender

. Has anyone experienced something similar before

Here’s what the text looks like next to an icon… This has been doing my head in!

You could try using “Vertical Trim” to cap the height to the baseline, to see if that helps.

I applied Auto height instead of a specific number it seems to fix it for now…

1 Like