| <!DOCTYPE html> |
| <html class="reftest-wait"> |
| <head> |
| <meta charset="utf-8"> |
| <title>Fraction parameters</title> |
| <style> |
| math, mspace { |
| font-size: 20px; |
| } |
| @font-face { |
| font-family: displaystylegapmin4000; |
| src: url("/fonts/math/stack-displaystylegapmin4000.woff"); |
| } |
| #reference { |
| background: green; |
| } |
| #frame { |
| position: absolute; |
| border-top: 4px solid black; |
| border-bottom: 4px solid black; |
| width: 100%; |
| } |
| </style> |
| <script> |
| function runTests() { |
| var div = document.getElementById("frame"); |
| var refBox = document.getElementById("reference").getBoundingClientRect(); |
| div.style.top = `${refBox.top-2}px`; |
| div.style.height = `${refBox.height-4}px`; |
| document.documentElement.classList.remove('reftest-wait'); |
| } |
| window.addEventListener("load", function() { |
| // Delay the check to workaround WebKit's bug https://webkit.org/b/174030. |
| requestAnimationFrame(() => { document.fonts.ready.then(runTests); }); |
| }); |
| </script> |
| </head> |
| <body> |
| <p> |
| This test passes if the blue squares are aligned: |
| </p> |
| <p> |
| <math display="block" style="font-family: displaystylegapmin4000"> |
| <mspace height="10em" depth="10em"/> |
| <mfrac linethickness="0px"> |
| <mspace width="3em" depth="1em"/> |
| <mspace id="reference" width="3em" height=".5em" depth=".5em"/> |
| </mfrac> |
| <mfrac linethickness="0px"> |
| <mspace width="3em" depth="1em"/> |
| <mspace width="1em" height=".5em" depth=".5em" style="background: blue"/> |
| </mfrac> |
| <mfrac linethickness="0px"> |
| <mspace width="3em" depth="1.5em"/> |
| <mspace width="1em" height="1em" style="background: blue"/> |
| </mfrac> |
| <mfrac linethickness="0px"> |
| <mspace width="3em" depth=".5em"/> |
| <mspace width="1em" depth="1em" style="background: blue"/> |
| </mfrac> |
| </math> |
| </p> |
| <div id="frame"></div> |
| </body> |
| </html> |
