LayoutTests/mathml/presentation/scripts-underover.html

<!doctype html>
<meta name="fuzzy" content="maxDifference=187-255; totalPixels=219-357" />
<html>
  <head>
    <title>scripts</title>
    <meta charset="utf-8"/>
    <style>
      td {
        border: 1px solid black;
        text-align: center; width: 100px; height: 100px;
        vertical-align: middle;
        font-family: Ahem;
        font-size: 15px;
      }
      span {
        display: inline-block;
        background: black;
        border: 0;
        margin: 0;
      }
      math {
        font-family: Ahem;
      }
    </style>
  </head>
  <body>

    <!-- The under/over scripts should be hidden by the black rectangles -->
    <table style="position: absolute; top: 10px; left: 10px;">
      <tr>
        <td style="vertical-align: top;">
          <math>
            <munder>
              <mspace width="20px" height="20px" depth="0px" mathbackground="red"/>
              <mspace width="10px" height="5px" depth="5px" mathbackground="green"/>
            </munder>
          </math>
        </td>
        <td>
          <math>
            <munderover>
              <mspace width="20px" height="10px" depth="10px" mathbackground="red"/>
              <mspace width="10px" height="5px" depth="5px" mathbackground="green"/>
              <mspace width="10px" height="5px" depth="5px" mathbackground="blue"/>
            </munderover>
          </math>
        </td>
        <td  style="vertical-align: bottom;">
          <math>
            <mover>
              <mspace width="20px" height="20px" depth="0px" mathbackground="red"/>
              <mspace width="10px" height="5px" depth="5px" mathbackground="green"/>
            </mover>
          </math>
        </td>
      </tr>
    </table>

    <table style="position: absolute; top: 10px; left: 10px;">
      <tr>
        <td style="vertical-align: top;">
          <span style="width: 12px; height: 50px;"></span>
        </td>
        <td>
          <span style="width: 12px; height: 50px;"></span>
        </td>
        <td  style="vertical-align: bottom;">
          <span style="width: 12px; height: 50px;"></span>
        </td>
      </tr>
    </table>

    <!-- The bases should be hidden by the black rectangles -->
    <table style="position: absolute; top: 120px; left: 10px;">
      <tr>
        <td style="vertical-align: top;">
          <math>
            <munder>
              <mspace width="20px" height="20px" depth="0px" mathbackground="red"/>
              <mspace width="10px" height="5px" depth="5px" mathbackground="green"/>
            </munder>
          </math>
        </td>
        <td>
          <math>
            <munderover>
              <mspace width="20px" height="10px" depth="10px" mathbackground="red"/>
              <mspace width="10px" height="5px" depth="5px" mathbackground="green"/>
              <mspace width="10px" height="5px" depth="5px" mathbackground="blue"/>
            </munderover>
          </math>
        </td>
        <td  style="vertical-align: bottom;">
          <math>
            <mover>
              <mspace width="20px" height="20px" depth="0px" mathbackground="red"/>
              <mspace width="10px" height="5px" depth="5px" mathbackground="blue"/>
            </mover>
          </math>
        </td>
      </tr>
    </table>

    <table style="position: absolute; top: 120px; left: 10px;">
      <tr>
        <td style="vertical-align: top;">
          <span style="width: 25px; height: 25px;"></span>
        </td>
        <td>
          <span style="width: 25px; height: 25px;"></span>
        </td>
        <td style="vertical-align: bottom;">
          <span style="width: 25px; height: 25px;"></span>
        </td>
      </tr>
    </table>

    <div style="position: absolute; top: 250px; left: 10px;">
      <math>
        <munder>
          <mn>1</mn>
          <mn>2</mn>
        </munder>
        <mover>
          <mn>1</mn>
          <mn>2</mn>
        </mover>
        <munderover>
          <mn>1</mn>
          <mn>2</mn>
          <mn>3</mn>
        </munderover>
      </math>
    </div>

  </body>
</html>