content-box-smaller-than-scrollbar.html

<!DOCTYPE html>
<style>
    /* Avoid padding on the sides that have a scrollbar, since our current
       behavior is inconsistent. */
    .scrollable { overflow:scroll; width:2px; height:2px; border:solid; border-width:1px 2px 2px 1px; padding:1px 2px 0; }
    .ltr { direction:ltr; padding-right:0; }
    .rtl { direction:rtl; padding-left:0; }
    .scrollable > div { width:500px; height:600px; }
    .scrollable > div.inline-block { display:inline-block; vertical-align:top; }
</style>
<div class="scrollable ltr" id="ltrWithBlockLevel">
    <div></div>
</div>
<div class="scrollable rtl" id="rtlWithBlockLevel">
    <div></div>
</div>
<div class="scrollable ltr" id="ltrWithInlineLevel">
    <div class="inline-block"></div>
</div>
<div class="scrollable rtl" id="rtlWithInlineLevel">
    <div class="inline-block"></div>
</div>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script>
    test(function() {
        var elm = document.getElementById("ltrWithBlockLevel");
        assert_equals(elm.scrollWidth, 502);
        assert_equals(elm.scrollHeight, 601);
    }, "LTR scrollable with block-level child");
    test(function() {
        var elm = document.getElementById("rtlWithBlockLevel");
        assert_equals(elm.scrollWidth, 502);
        assert_equals(elm.scrollHeight, 601);
    }, "RTL scrollable with block-level child");
    test(function() {
        var elm = document.getElementById("ltrWithInlineLevel");
        assert_equals(elm.scrollWidth, 502);
        assert_equals(elm.scrollHeight, 601);
    }, "LTR scrollable with inline-level child");
    test(function() {
        var elm = document.getElementById("rtlWithInlineLevel");
        assert_equals(elm.scrollWidth, 502);
        assert_equals(elm.scrollHeight, 601);
    }, "RTL scrollable with inline-level child");
</script>
chromium/third_party/blink/web_tests/fast/scrolling/content-box-smaller-than-scrollbar.html
