## The Problem The font that we use, Nure, displays inconsistently between Android (Linux) and Windows. The issues are shown in the screenshots below. We observe the following: 1. `line-height` is set to `0.3` with a `background-color` of `red` to show the bounds in relation to the font. 2. Note the differences in the position of the red bar in relation: 1. In Windows we observe the red bar appearing slightly to the top of the font. 2. In Android (and Linux) the red bar appears almost centered. We originally encountered this issue when working on The Eye Logo for Ascension Quest as documented in [[99 About/998 Platform/9981 Obsidian Platform/Project Changelog|Project Changelog]] and we solved it with some JavaScript. After noticing it affected callouts and fixing it, the issue with The Eye that required a JavaScript fix was no longer needed. ### Windows ![[Assets/font-issue-1.png]] ### Android ![[Assets/font-issue-2.jpg]] ### Windows ![[Assets/font-issue-3.png]] ### Android ![[Assets/font-issue-4.jpg]] ### Windows ![[Assets/font-issue-5.png]] ### Android ![[Assets/font-issue-6.jpg]] ## The Solution Declaring the `@font` with `ascent-override` and `descent-override` as it's documented in: [The W3 Spec](https://www.w3.org/TR/css-fonts-4/#example-7315a3e2) ### Windows (with fix) ![[Assets/font-issue-7.png]] ### Android (with fix) ![[Assets/font-issue-8.jpg]]