<!DOCTYPE html>
<!--
 | This test is to show that 'replaced boxes' have the correct width.
 | Ref https://www.w3.org/TR/CSS21/visudet.html#inline-replaced-width
 -->
<html>
<head>
  <style>
    body {
      margin: 0px;
    }
    div.smallish {
      display: block;
      width: 640px;
      height: 360px;
    }
    div.block {
      display: block;
    }
    div.block40 {
      display: block;
      width: 40px;
    }
    div.inline {
      display: inline;
    }
    video.test1 {
      width: 64px;
      height: 36px;
      background: #001000;
    }
    video.test2 {
      width: 32px;
      background: #005000;
    }
    video.test3 {
      height: 32px;
      background: #009000;
    }
    video.test4 {
      background: #00D000;
    }
    video.test5 {
      width: 20%;
      background: #00FF00;
    }
  </style>
</head>
<body>
  <div class='smallish'>
    <div class='block'>
      <video class='test1'>Do not show this</video>
      <video class='test2'>Do not show this</video>
      <video class='test3'>Do not show this</video>
      <video class='test4'>Do not show this</video>
      <video class='test5'>Do not show this</video>
    </div>
    <div class='block40'>
      <video class='test5'>Do not show this</video>
    </div>
    <div class='inline'>
      <video class='test1'>Do not show this</video>
      <video class='test2'>Do not show this</video>
      <video class='test3'>Do not show this</video>
      <video class='test4'>Do not show this</video>
      <video class='test5'>Do not show this</video>
    </div>
  </div>
</body>
</html>