diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-multicol/multicol-gap-fraction-002.html')
-rw-r--r-- | testing/web-platform/tests/css/css-multicol/multicol-gap-fraction-002.html | 68 |
1 files changed, 68 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-multicol/multicol-gap-fraction-002.html b/testing/web-platform/tests/css/css-multicol/multicol-gap-fraction-002.html new file mode 100644 index 0000000000..ae1aaaad77 --- /dev/null +++ b/testing/web-platform/tests/css/css-multicol/multicol-gap-fraction-002.html @@ -0,0 +1,68 @@ +<!DOCTYPE html> +<title>CSS Multi-column Layout Test: 'column-gap' with sub-pixel values</title> +<link rel="author" title="Morten Stenshorne" href="mstensho@chromium.org"> +<link rel="help" href="http://www.w3.org/TR/css3-multicol/#column-gap" title="4.1. 'column-gap'"> +<link rel="match" href="../reference/nothing.html" /> +<meta name="assert" content="Specified column-gap should never be rounded up to the nearest integer, or the second column in the tests might overflow the multicol container in the inline direction."> +<style> + .multicol { margin:10px; float:left; columns:2; width:50px; column-gap:10.9px; column-fill:auto; height:50px; background:white; } + .filler { height:50px; } + .below-everything { position:relative; z-index:-1; float:right; width:20px; height:20px; background:red; } +</style> + +<p>There should be nothing below.</p> + +<div class="multicol" style="column-gap:10px;"> + <div class="filler"></div> + <div class="below-everything"></div> +</div> + +<div class="multicol" style="column-gap:10.1px;"> + <div class="filler"></div> + <div class="below-everything"></div> +</div> + +<div class="multicol" style="column-gap:10.2px;"> + <div class="filler"></div> + <div class="below-everything"></div> +</div> + +<div class="multicol" style="column-gap:10.3px;"> + <div class="filler"></div> + <div class="below-everything"></div> +</div> + +<div class="multicol" style="column-gap:10.4px;"> + <div class="filler"></div> + <div class="below-everything"></div> +</div> + +<div class="multicol" style="column-gap:10.5px;"> + <div class="filler"></div> + <div class="below-everything"></div> +</div> + +<div class="multicol" style="column-gap:10.6px;"> + <div class="filler"></div> + <div class="below-everything"></div> +</div> + +<div class="multicol" style="column-gap:10.7px;"> + <div class="filler"></div> + <div class="below-everything"></div> +</div> + +<div class="multicol" style="column-gap:10.8px;"> + <div class="filler"></div> + <div class="below-everything"></div> +</div> + +<div class="multicol" style="column-gap:10.9px;"> + <div class="filler"></div> + <div class="below-everything"></div> +</div> + +<div class="multicol" style="column-gap:11px;"> + <div class="filler"></div> + <div class="below-everything"></div> +</div> |