vertical-align-middle-overflow.html

<!DOCTYPE html>
<html>
    <head>
        <style>
            .block {
                overflow-x: hidden;
                width: 100px;
            }
            .icon {
                display: inline-block;
                background-color: red;
                height: 29px;
                width: 29px;
                vertical-align: middle;
            }
        </style>
        <script src="../../resources/js-test.js"></script>
    </head>
    <body>
        <div id="test-block" class="block">
            <span class="icon">&nbsp;</span>
            <span>Cell 2</span>
        </div>

        <p>
            The block above should not have a scrollbar.
        </p>
        
        <script>
            var element = document.getElementById('test-block');

            if (element.offsetHeight == element.scrollHeight)
                testPassed('Does not overflow.');
            else
                testFailed('Overflows, offsetHeight ' + element.offsetHeight + 'px, scrollHeight ' + element.scrollHeight + 'px');
        </script>
  </body>
</html>

chromium/third_party/blink/web_tests/fast/sub-pixel/vertical-align-middle-overflow.html