underover-stretchy-001-ref.html (5440B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"/> 5 <title>Horizontal stretchy operator (reference)</title> 6 <style> 7 @font-face { 8 font-family: TestFont; 9 src: url("/fonts/math/stretchy.woff"); 10 } 11 math, mo { 12 font-family: TestFont; 13 font-size: 50px; 14 } 15 </style> 16 <body> 17 <p>This test passes if you see green rectangles and no red.</p> 18 19 <div style="position: absolute; left: 3em; top; 3em; 20 width: 1000px; height: 500px; background: lightgreen;"> 21 22 <div style="position: absolute; top: 1px; left: 1px;"> 23 <!-- stretchy base in munder --> 24 <div style="position: absolute; left: 0; top: 0;"> 25 <math> 26 <munder> 27 <mo lspace="0" rspace="0" style="color: green;">⥚</mo> 28 <mspace width="200px" height="0px"/> 29 </munder> 30 </math> 31 </div> 32 </div> 33 34 <div style="position: absolute; top: 1px; left: 251px;"> 35 <!-- stretchy script in munder --> 36 <div style="position: absolute; left: 0; top: 0;"> 37 <math> 38 <munder> 39 <mspace width="200px" height="0px"/> 40 <mo lspace="0" rspace="0" style="color: green;">⥚</mo> 41 </munder> 42 </math> 43 </div> 44 </div> 45 46 <div style="position: absolute; top: 101px; left: 1px;"> 47 <!-- stretchy base in mover --> 48 <div style="position: absolute; left: 0; top: 0;"> 49 <math> 50 <mover> 51 <mo lspace="0" rspace="0" style="color: green;">⥚</mo> 52 <mspace width="200px" height="0px"/> 53 </mover> 54 </math> 55 </div> 56 </div> 57 58 <div style="position: absolute; top: 101px; left: 251px;"> 59 <!-- stretchy script in mover --> 60 <div style="position: absolute; left: 0; top: 0;"> 61 <math> 62 <mover> 63 <mspace width="200px" height="0px"/> 64 <mo lspace="0" rspace="0" style="color: green;">⥚</mo> 65 </mover> 66 </math> 67 </div> 68 </div> 69 70 <div style="position: absolute; top: 201px; left: 1px;"> 71 <!-- stretchy base in munderover --> 72 <div style="position: absolute; left: 0; top: 0;"> 73 <math> 74 <munderover> 75 <mo lspace="0" rspace="0" style="color: green;">⥚</mo> 76 <mspace width="200px" height="0px"/> 77 <mspace width="200px" height="0px"/> 78 </munderover> 79 </math> 80 </div> 81 </div> 82 83 <div style="position: absolute; top: 201px; left: 251px;"> 84 <!-- stretchy underscript in munderover --> 85 <div style="position: absolute; left: 0; top: 0;"> 86 <math> 87 <munderover> 88 <mspace width="200px" height="0px"/> 89 <mo lspace="0" rspace="0" style="color: green;">⥚</mo> 90 <mspace width="200px" height="0px"/> 91 </munderover> 92 </math> 93 </div> 94 </div> 95 96 <div style="position: absolute; top: 301px; left: 1px;"> 97 <!-- stretchy overscript in munderover --> 98 <div style="position: absolute; left: 0; top: 0;"> 99 <math> 100 <munderover> 101 <mspace width="200px" height="0px"/> 102 <mspace width="200px" height="0px"/> 103 <mo lspace="0" rspace="0" style="color: green;">⥚</mo> 104 </munderover> 105 </math> 106 </div> 107 </div> 108 109 <div style="position: absolute; top: 1px; left: 501px;"> 110 <!-- stretchy base and underscript in munderover --> 111 <div style="position: absolute; left: 0; top: 0;"> 112 <math> 113 <munderover> 114 <mo lspace="0" rspace="0" style="color: green;">⥚</mo> 115 <mspace width="200px" height="0px"/> 116 <mo lspace="0" rspace="0" style="color: green;">⥚</mo> 117 </munderover> 118 </math> 119 </div> 120 </div> 121 122 <div style="position: absolute; top: 151px; left: 501px;"> 123 <!-- stretchy base and overscript in munderover --> 124 <div style="position: absolute; left: 0; top: 0;"> 125 <math> 126 <munderover> 127 <mo lspace="0" rspace="0" style="color: green;">⥚</mo> 128 <mspace width="200px" height="0px"/> 129 <mo lspace="0" rspace="0" style="color: green;">⥚</mo> 130 </munderover> 131 </math> 132 </div> 133 </div> 134 135 <div style="position: absolute; top: 301px; left: 501px;"> 136 <!-- stretchy scripts in munderover --> 137 <div style="position: absolute; left: 0; top: 0;"> 138 <math> 139 <munderover> 140 <mspace width="200px" height="0px"/> 141 <mo lspace="0" rspace="0" style="color: green;">⥚</mo> 142 <mo lspace="0" rspace="0" style="color: green;">⥚</mo> 143 </munderover> 144 </math> 145 </div> 146 </div> 147 148 <div style="position: absolute; top: 1px; left: 751px;"> 149 <!-- Only stretchy operators in munderover. The widest unstretched size 150 is used as the target size. --> 151 <div style="position: absolute; left: 0; top: 0;"> 152 <math> 153 <munderover> 154 <mo lspace="0" rspace="0" style="font-size: 1em; color: green;">⥚</mo> 155 <mo lspace="0" rspace="0" style="font-size: 4em; color: green;">⥚</mo> 156 <mo lspace="0" rspace="0" style="font-size: 2em; color: green;">⥚</mo> 157 </munderover> 158 </math> 159 </div> 160 </div> 161 </div> 162 <script> 163 MathMLFeatureDetection.ensure_for_match_reftest("has_mspace"); 164 MathMLFeatureDetection.ensure_for_match_reftest("has_munderover"); 165 </script> 166 </body> 167 </html>