<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <title>Test</title>
  <style type="text/css">
    .outer { width: 100px; }
    .test { max-width: 50%; }
    .control { height: 50px; width: 50px; }
  </style>
  <link rel="help" href="http://www.w3.org/TR/CSS21/visudet.html#min-max-widths" title="10.4 Minimum and maximum widths: &apos;min-width&apos; and &apos;max-width&apos;">
</head>
<body>
  <p>In this test you should see two identical blue squares, each 50px by 50px.</p>
  <div class="outer">
    <img src="resources/square-blue-100x100.png" alt="FAIL: Image support required." class="test">
  </div>
  <br>
  <img src="resources/square-blue-100x100.png" alt="FAIL: Image support required." class="control">
</body>
</html>