diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-ruby/br-clear-all-002.html')
| -rw-r--r-- | testing/web-platform/tests/css/css-ruby/br-clear-all-002.html | 53 |
1 files changed, 53 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-ruby/br-clear-all-002.html b/testing/web-platform/tests/css/css-ruby/br-clear-all-002.html new file mode 100644 index 0000000000..487fd33b5c --- /dev/null +++ b/testing/web-platform/tests/css/css-ruby/br-clear-all-002.html @@ -0,0 +1,53 @@ +<!DOCTYPE html> +<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org"> +<link rel="help" href="https://www.w3.org/TR/css-ruby-1/#rubypos"> +<link rel="help" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/br#deprecated_attributes"> +<style> + #float { + float: left; + width: 100px; + height: 100px; + background: cyan; + } + #container { + padding-bottom: 50px; + line-height: 20px; + background: yellow; + } + ruby { + ruby-position: under; + } + ruby > div { + display: inline-block; + width: 20px; + height: 20px; + background: hotpink; + } + rt > div { + display: inline-block; + width: 50px; + height: 150px; + background: blue; + } +</style> +<p>The yellow box should encompass its contents and also the cyan float, due to + clearance. The yellow box has bottom padding, and the blue ruby annotation box + is allowed to overflow into the padding area. In this case the blue box is so + tall it will use the entire padding area, and also stretch the yellow box + somewhat.</p> +<div id="float"></div> +<div id="container" data-expected-height="170"> + <ruby> + <div></div> + <rt> + <div></div> + </rt> + </ruby> + <br clear="all"> +</div> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/resources/check-layout-th.js"></script> +<script> + checkLayout("#container"); +</script> |