Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
Last revisionBoth sides next revision
ideas:bad-font-metrics [2018/01/12 10:42] – [Bad Font Metrics Are Bad: Why Good Font Metrics Matter] fantasaiideas:bad-font-metrics [2018/01/12 10:49] – [List of Font Metrics Used by CSS] fantasai
Line 3: Line 3:
 CSS relies on accurate font metrics to generate correct layouts. Unfortunately, most fonts provide inaccurate font metrics. This page is a collection of where CSS uses, or would like to use, font metrics and why it sucks to have bad font metrics in your font. CSS relies on accurate font metrics to generate correct layouts. Unfortunately, most fonts provide inaccurate font metrics. This page is a collection of where CSS uses, or would like to use, font metrics and why it sucks to have bad font metrics in your font.
  
-===== Font Metrics Used by CSS =====+=== List of Font Metrics Used by CSS ===
  
   * alphabetic baseline   * alphabetic baseline
Line 11: Line 11:
   * cap height (''insert OpenType label here'')   * cap height (''insert OpenType label here'')
   * ...   * ...
 +
 +===== Font-relative Units =====
 +
 +CSS has a variety of [[https://www.w3.org/TR/css-values/#font-relative-lengths|font-relative length units]], which authors use to lay out content on their pages. Inaccurate font metrics mean layouts using these length units don't visually line up with the shapes of the letters they're meant to reference.
 +
 +XXX Draw some examples of cap height and ex height stripes and things.
 +
 +XXX Gaiji example using ic unit to maintain sizing relative to surrounding text.
  
 ===== Superscripts and Subscripts ===== ===== Superscripts and Subscripts =====
 
Recent changes RSS feed Valid XHTML 1.0 Valid CSS Driven by DokuWiki