| <!doctype html> |
| <html> |
| <head> |
| <title>mo stacked glyphs</title> |
| <meta charset="utf-8"/> |
| </head> |
| <body> |
| |
| <!-- Test some stretchy operators requiring stacked glyphs at large sizes. --> |
| <div style="position: absolute; top: 25px; left: 0; opacity: 0.75;"> |
| <math> |
| <mrow> |
| <mo>(</mo> |
| <mo>)</mo> |
| <mo>{</mo> |
| <mo>}</mo> |
| <mo>[</mo> |
| <mo>]</mo> |
| <mo>|</mo> |
| <mo stretchy="true">∫</mo> |
| <mspace height="200px" depth="200px"/> |
| </mrow> |
| </math> |
| </div> |
| |
| <!-- Same operators, but shifted vertically by one pixel. --> |
| <div style="position: absolute; top: 26px; left: 0; opacity: 0.75;"> |
| <math> |
| <mrow> |
| <mo>(</mo> |
| <mo>)</mo> |
| <mo>{</mo> |
| <mo>}</mo> |
| <mo>[</mo> |
| <mo>]</mo> |
| <mo>|</mo> |
| <mo stretchy="true">∫</mo> |
| <mspace height="200px" depth="200px"/> |
| </mrow> |
| </math> |
| </div> |
| |
| <!-- Some horizontal bands to hide the top/middle/bottom parts of the |
| operators and only show the straight lines. Note that the two previous |
| <div> elements have opacity>0.5 and are only shifted vertically by |
| one pixel. Hence the overlapped <div>'s should look like one <div> of |
| opacity=1, provided there are no gaps between the stacked glyphs and |
| that these glyphs are perfectly aligned. --> |
| <div style="position: absolute; top: 0px; left: 0; width: 100%; height: 150px; background: red;"></div> |
| <div style="position: absolute; top: 200px; left: 0; width: 100%; height: 150px; background: red;"></div> |
| <div style="position: absolute; top: 400px; left: 0; width: 100%; height: 150px; background: red;"></div> |
| |
| </body> |
| </html> |
