testing/web-platform/tests/css/css-fonts/variations/variable-gpos-m2b.html

   1 <!DOCTYPE html>
   2 <html class="reftest-wait">
   3 <link rel="match" href="variable-gpos-m2b-ref.html">
   4 <meta charset="utf-8">
   5 <style>
   6     @font-face {
   7     font-family: variabletest_box;
   8     src: url(resources/variabletest_box.ttf);
   9     }
  10
  11     body {
  12     font-family: variabletest_box, sans-serif;
  13     sans-serif;
  14     font-size: 100px;
  15     }
  16
  17     .gpos_m2b_left {
  18     font-variation-settings: "VM2B" 0;
  19     }
  20
  21     .gpos_m2b_middle {
  22     font-variation-settings: "VM2B" 500;
  23     }
  24
  25     .gpos_m2b_right {
  26     font-variation-settings: "VM2B" 1000;
  27     }
  28 </style>
  29 <!-- The variabletest_box font has an M glyph saying "m2b pos" that combines
  30      with the combining box below. And it has a glyph for combining box below
  31      whose mark anchor can be shifted horizontally using the VM2B axis. The font
  32      also has N and O glyphs which have fixed shifted base anchor points at the
  33      middle and at the right position. In this reftest we check whether
  34      applying the VM2B axis works as expected and shifts the mark anchor point
  35      left so that the combining mark is placed correctly at the middle and at
  36      the right position. The VM2B rendering must be identical to the
  37      conventional rendering with the fixed base anchor points. -->
  38 <span class="gpos_m2b_left">M&#x033B;</span>
  39 <span class="gpos_m2b_middle">M&#x033B;</span>
  40 <span class="gpos_m2b_right">M&#x033B;</span>
  41 <script>
  42     document.fonts.ready.then(
  43         () => { document.documentElement.classList.remove("reftest-wait"); });
  44 </script>
  45 </html>