<!DOCTYPE html>
<html>
  <head>
    <title>mspace units with zoom</title>
    <style>
    body {
      zoom: 1.5;
    }
    </style>
  </head>
  <body>
    <math style="position: absolute; top: 0; left: 0;">
      <mspace width="5em" height="10px" mathbackground="red"/>
    </math>

    <math style="position: absolute; top: 10px; left: 0;">
      <mspace width="60pt" height="10px" mathbackground="green"/>
    </math>

    <math style="position: absolute; top: 20px; left: 0;">
      <mspace width="5pc" height="10px" mathbackground="blue"/>
    </math>

    <math style="position: absolute; top: 30px; left: 0;">
      <mspace width="10ex" height="10px" mathbackground="red"/>
    </math>

    <math style="position: absolute; top: 40px; left: 0;">
      <mspace width="50px" height="10px" mathbackground="green"/>
    </math>

    <math style="position: absolute; top: 50px; left: 0;">
      <mspace width="1in" height="10px" mathbackground="blue"/>
    </math>

    <math style="position: absolute; top: 60px; left: 0;">
      <mspace width="2.54cm" height="10px" mathbackground="red"/>
    </math>

    <math style="position: absolute; top: 70px; left: 0;">
      <mspace width="25.4mm" height="10px" mathbackground="green"/>
    </math>
  </body>
</html>
