<!DOCTYPE html>
<html>
  <head>
    <title>Border-after in vertical-rl mode, non-visible overflow</title>
    <style>
      body { color:black; background:white; }
      #container {
        -webkit-writing-mode: vertical-rl;
        overflow:hidden;
        -webkit-logical-height:100px;
        -webkit-border-after:150px solid white;
        background:red;
      }
      #inner { -webkit-logical-height:200px; background:white; }
    </style>
    <script>
      if (window.testRunner)
        testRunner.dumpAsText();
    </script>
  </head>
  <body>
    <p>The word 'HEST' should be seen below, and there should be no red.</p>
    <div id="container">
      <div id="inner">HEST</div>
    </div>
    <script>
      if (window.testRunner) {
        var logicalHeight = container.scrollWidth;
        document.body.innerHTML = logicalHeight == 200 ? "PASS" : "FAIL - logicalHeight was " + logicalHeight;
      }
    </script>
  </body>
</html>