diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-flexbox/box-sizing-min-max-sizes-001.html')
-rw-r--r-- | testing/web-platform/tests/css/css-flexbox/box-sizing-min-max-sizes-001.html | 33 |
1 files changed, 33 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-flexbox/box-sizing-min-max-sizes-001.html b/testing/web-platform/tests/css/css-flexbox/box-sizing-min-max-sizes-001.html new file mode 100644 index 0000000000..3aa9ce6bdc --- /dev/null +++ b/testing/web-platform/tests/css/css-flexbox/box-sizing-min-max-sizes-001.html @@ -0,0 +1,33 @@ +<!DOCTYPE html> +<title>CSS Flexbox: minimum / maximum sizes with box-sizing: border-box</title> +<link href="support/flexbox.css" rel="stylesheet"> +<link rel="help" href="https://drafts.csswg.org/css-flexbox/#box-model"> +<link rel="help" href="https://drafts.csswg.org/css2/visudet.html#min-max-widths"> +<meta name="assert" content="This test checks that a minimum and maximum sizes are correctly computed for flexbox children."> + +<style> +.flexbox { + background-color: teal; +} +.flexbox > div { + box-sizing: border-box; +} +</style> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/resources/check-layout-th.js"></script> +<body onload="checkLayout('.flexbox')"> +<div id=log></div> + +<div class="flexbox"> + <div style="border: 5px solid orange; padding: 5px; max-width: 30px; width: 40px;" data-expected-width=30></div> + <div style="border: 5px solid orange; padding: 5px; min-width: 30px; width: 10px;" data-expected-width=30></div> +</div> + +<div class="flexbox column"> + <div style="border: 5px solid orange; padding: 5px; max-height: 30px; height: 40px;" data-expected-height=30></div> + <div style="border: 5px solid orange; padding: 5px; min-height: 30px; height: 10px;" data-expected-height=30></div> +</div> + +</body> +</html> |