overflow-inline-002.html | Explore in Territory

<!doctype html>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<style>
#container {
  font: 20px Ahem;
  overflow-y: scroll;
  outline: black solid 1px;
  width: 120px;
}
#target {
  padding-bottom: 200px;
  outline: rgba(0,255.0, 0.3) solid 3px;
}
</style>
<!--
  #target's padding bottom does is not part line height of first linebox,
  but is part of scroll overflow of first linebox.
-->
<p>Overflow of inline children descendants: linebox should propagate children
scroll overflow to container.
.</p>
<div id="container"><span id="ref">0 1 </span><span id="target">2</span> 3 4 5</div></div>
<script>

var container = document.querySelector('#container');
var target = document.querySelector('#target');
var ref = document.querySelector('#ref');

test(function() {
  var targetStyle = window.getComputedStyle(target);
  assert_equals(container.scrollHeight,
    ref.offsetHeight + parseInt(targetStyle.paddingBottom),
    "vertical");
}, "overflow with padding");

</script>

chromium/third_party/blink/web_tests/overflow/overflow-inline-002.html