Dave Keenan: Request for ascent, descent and line-gap overrides to be added to the BravuraText @font-face rule so vertical alignment becomes consistent between Windows/Android and Mac/iPhone.

2026-05-02T04:08:22Z

Request for ascent, descent and line-gap overrides to be added to the BravuraText @font-face rule so vertical alignment becomes consistent between Windows/Android and Mac/iPhone.

New page

Hi Fredg999, could we please have the following overrides added to the BravuraText @font-face rule in common.css.
<pre><nowiki>
@font-face {
font-family: BravuraText;
src: url(https://scaleworkshop.plainsound.org/static/fonts/BravuraText.woff2);
ascent-override: 80%; /* Without these overrides, vertical alignment */
descent-override: 20%; /* is different on Windows and Android versus */
line-gap-override: 20%; /* Mac and iPhone which have it correct. */
}
</nowiki></pre>
When writing the sagittal template, and more recently the svg template, I struggled to achieve even-approximately the same vertical alignment of symbols in both Windows and Mac browsers, only to find that my carefully crafted solution fails when the line-height is changed. So I researched the reason for this discrepancy. I found the explanation here: https://web.archive.org/web/20140705031318/http://www.webfonts.info:80/node/330 and the solution here: https://drafts.csswg.org/css-fonts/#font-metrics-override-desc

[[User:Dave Keenan|Dave Keenan]] ([[User talk:Dave Keenan|talk]]) 04:08, 2 May 2026 (UTC)

User talk:Fredg999/common.css - Revision history

Dave Keenan: Request for ascent, descent and line-gap overrides to be added to the BravuraText @font-face rule so vertical alignment becomes consistent between Windows/Android and Mac/iPhone.