<html>
<head>
<style>
.block
{
    width:100px;
    height:200px;
    padding:50%;
    background-color:green;
}
</style>
</head>
<body>
<div style="width:100px;height:200px; -webkit-writing-mode:vertical-lr">
<div id="test" class="block"></div>
</div>
<div id="console"></div>
<script>
if (window.testRunner)
    window.testRunner.dumpAsText();
test = document.getElementById("test");
rect = test.getBoundingClientRect();
width = rect.right - rect.left;
height = rect.bottom - rect.top;
if (width != 300 || height != 400) {
  document.getElementById('console').innerHTML = "FAIL: The block should be 300x400 pixels in size.";
  test.style.backgroundColor = 'red';
} else
  document.getElementById('console').innerHTML = "PASS: The block is the correct size.";
</script>
</body>
</html>