mirror of
https://github.com/servo/servo.git
synced 2025-08-11 00:15:32 +01:00
Update CSS tests to revision 31d63cc79bd4c929ed582229e936d7b389f3e6ab
This commit is contained in:
James Graham
parent
1a81b18b9f
commit
2c9faf5363
91915 changed files with 5979820 additions and 0 deletions
69
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/chapter-1.xht
Normal file
69
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/chapter-1.xht
Normal file
|
|
@ -0,0 +1,69 @@
|
|||
|
||||
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Introduction - CSS Shapes Module Level 1 CR Test Suite</title>
|
||||
<style type="text/css">
|
||||
@import "http://www.w3.org/StyleSheets/TR/base.css";
|
||||
@import "../indices.css";
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<h1>CSS Shapes Module Level 1 CR Test Suite</h1>
|
||||
<h2>Introduction (0 tests)</h2>
|
||||
<table width="100%">
|
||||
<col id="test-column"></col>
|
||||
<col id="refs-column"></col>
|
||||
<col id="flags-column"></col>
|
||||
<col id="info-column"></col>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Test</th>
|
||||
<th><abbr title="Rendering References">Refs</abbr></th>
|
||||
<th>Flags</th>
|
||||
<th>Info</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="s1">
|
||||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s1">+</a>
|
||||
<a href="http://www.w3.org/TR/css-shapes-1/#intro">1 Introduction</a></th></tr>
|
||||
<!-- 0 tests -->
|
||||
</tbody>
|
||||
<tbody id="s1.1">
|
||||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s1.1">+</a>
|
||||
<a href="http://www.w3.org/TR/css-shapes-1/#module-interactions">1.1 Module Interactions</a></th></tr>
|
||||
<!-- 0 tests -->
|
||||
</tbody>
|
||||
<tbody id="s1.2">
|
||||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s1.2">+</a>
|
||||
<a href="http://www.w3.org/TR/css-shapes-1/#values">1.2 Values</a></th></tr>
|
||||
<!-- 0 tests -->
|
||||
</tbody>
|
||||
<tbody id="s1.3">
|
||||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s1.3">+</a>
|
||||
<a href="http://www.w3.org/TR/css-shapes-1/#animations">1.3 Animated Values</a></th></tr>
|
||||
<!-- 0 tests -->
|
||||
</tbody>
|
||||
<tbody id="s1.4">
|
||||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s1.4">+</a>
|
||||
<a href="http://www.w3.org/TR/css-shapes-1/#terminology">1.4 Terminology</a></th></tr>
|
||||
<!-- 0 tests -->
|
||||
</tbody>
|
||||
<tbody id="s1.4.#float-area">
|
||||
<!-- 0 tests -->
|
||||
</tbody>
|
||||
<tbody id="s1.4.#wrap">
|
||||
<!-- 0 tests -->
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
141
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/chapter-2.xht
Normal file
141
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/chapter-2.xht
Normal file
|
|
@ -0,0 +1,141 @@
|
|||
|
||||
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Relation to the box model and float behavior - CSS Shapes Module Level 1 CR Test Suite</title>
|
||||
<style type="text/css">
|
||||
@import "http://www.w3.org/StyleSheets/TR/base.css";
|
||||
@import "../indices.css";
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<h1>CSS Shapes Module Level 1 CR Test Suite</h1>
|
||||
<h2>Relation to the box model and float behavior (9 tests)</h2>
|
||||
<table width="100%">
|
||||
<col id="test-column"></col>
|
||||
<col id="refs-column"></col>
|
||||
<col id="flags-column"></col>
|
||||
<col id="info-column"></col>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Test</th>
|
||||
<th><abbr title="Rendering References">Refs</abbr></th>
|
||||
<th>Flags</th>
|
||||
<th>Info</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="s2">
|
||||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s2">+</a>
|
||||
<a href="http://www.w3.org/TR/css-shapes-1/#relation-to-box-model-and-float-behavior">2 Relation to the box model and float behavior</a></th></tr>
|
||||
<!-- 9 tests -->
|
||||
<tr id="shape-outside-001-2" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-001.xht">shape-outside-001</a></strong></td>
|
||||
<td><a href="reference/shape-outside-001-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>Left and right float with shape-outside
|
||||
<ul class="assert">
|
||||
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-002-2" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-002.xht">shape-outside-002</a></strong></td>
|
||||
<td><a href="reference/shape-outside-001-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>Left and right float with shape-outside with clipped left float
|
||||
<ul class="assert">
|
||||
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left and that the left float shape is clipped to the float&acirc;&#8364;&#8482;s margin box</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-003-2" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-003.xht">shape-outside-003</a></strong></td>
|
||||
<td><a href="reference/shape-outside-001-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>Left and right float with shape-outside with clipped right float
|
||||
<ul class="assert">
|
||||
<li>This test verifies that left floats with a shape-outside only allow content wrapping on the right side, and right floats only allow wrapping on the left and that the right float shape is clipped to the float&acirc;&#8364;&#8482;s margin box</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-004-2" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-004.xht">shape-outside-004</a></strong></td>
|
||||
<td><a href="reference/shape-outside-004-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>inset with no extent and inline content - inset(50% 50% 50% 50%)
|
||||
<ul class="assert">
|
||||
<li>This test verifies that a shape with no extent allow inline content to flow through all of the float&acirc;&#8364;&#8482;s box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-005-2" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-005.xht">shape-outside-005</a></strong></td>
|
||||
<td><a href="reference/shape-outside-004-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>inset with no extent and inline content - inset(150% 150% 0% 0%)
|
||||
<ul class="assert">
|
||||
<li>This test verifies that a shape with no extent allow inline content to flow through all of the float&acirc;&#8364;&#8482;s box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-006-2" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-006.xht">shape-outside-006</a></strong></td>
|
||||
<td><a href="reference/shape-outside-006-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>shape-outside with open areas on both the left & right of the float area
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps only on one side of the float even though there is open area on both the left and right sides of the float.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-007-2" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-007.xht">shape-outside-007</a></strong></td>
|
||||
<td><a href="reference/shape-outside-007-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>Shape smaller than float content area - 1 float
|
||||
<ul class="assert">
|
||||
<li>This test verifies that inline content only wraps around the shape, and otherwise overlays the rest of the float margin box</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-008-2" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-008.xht">shape-outside-008</a></strong></td>
|
||||
<td><a href="reference/shape-outside-008-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>Shape smaller than float content area - 2 floats
|
||||
<ul class="assert">
|
||||
<li>This test verifies that inline content only wraps around the shapes, and otherwise overlays the rest of the float margin boxes when two floats are stacked next to each other.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-polygon-017-2" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-polygon-017.xht">shape-outside-polygon-017</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-017-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, polygon + shape-margin beyond margin box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that when a shape-margin is defined that extends beyond the margin box, the shape is clipped to the box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="s2.#empty-float-area">
|
||||
<!-- 0 tests -->
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
1548
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/chapter-3.xht
Normal file
1548
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/chapter-3.xht
Normal file
File diff suppressed because it is too large
Load diff
468
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/chapter-4.xht
Normal file
468
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/chapter-4.xht
Normal file
|
|
@ -0,0 +1,468 @@
|
|||
|
||||
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Shapes from Image - CSS Shapes Module Level 1 CR Test Suite</title>
|
||||
<style type="text/css">
|
||||
@import "http://www.w3.org/StyleSheets/TR/base.css";
|
||||
@import "../indices.css";
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<h1>CSS Shapes Module Level 1 CR Test Suite</h1>
|
||||
<h2>Shapes from Image (39 tests)</h2>
|
||||
<table width="100%">
|
||||
<col id="test-column"></col>
|
||||
<col id="refs-column"></col>
|
||||
<col id="flags-column"></col>
|
||||
<col id="info-column"></col>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Test</th>
|
||||
<th><abbr title="Rendering References">Refs</abbr></th>
|
||||
<th>Flags</th>
|
||||
<th>Info</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="s4">
|
||||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s4">+</a>
|
||||
<a href="http://www.w3.org/TR/css-shapes-1/#shapes-from-image">4 Shapes from Image</a></th></tr>
|
||||
<!-- 39 tests -->
|
||||
<tr id="shape-image-000-4" class="primary ahem image">
|
||||
<td><strong>
|
||||
<a href="shape-image-000.xht">shape-image-000</a></strong></td>
|
||||
<td><a href="reference/shape-image-000-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>Image shape on a left float
|
||||
<ul class="assert">
|
||||
<li>This test verifies that a shape specified as a png image in a data: url is properly respected on a left float.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-001-4" class="primary ahem image">
|
||||
<td><strong>
|
||||
<a href="shape-image-001.xht">shape-image-001</a></strong></td>
|
||||
<td><a href="reference/shape-image-001-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>Image shape on a left float
|
||||
<ul class="assert">
|
||||
<li>This test verifies that a shape specified as a png image with 70% alpha is treated as if the image had no alpha.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-002-4" class="primary ahem image">
|
||||
<td><strong>
|
||||
<a href="shape-image-002.xht">shape-image-002</a></strong></td>
|
||||
<td><a href="reference/shape-image-002-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>Image shape on a left float
|
||||
<ul class="assert">
|
||||
<li>This test verifies that a shape specified as a svg image in a data uri is properly interpreted as a shape.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-003-4" class="primary ahem image">
|
||||
<td><strong>
|
||||
<a href="shape-image-003.xht">shape-image-003</a></strong></td>
|
||||
<td><a href="reference/shape-image-002-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>Image shape on a left float
|
||||
<ul class="assert">
|
||||
<li>This test verifies that a shape specified as a svg image with 20% alpha and 0.3 shape-image-threshold creates a proper shape.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-004-4" class="primary ahem image">
|
||||
<td><strong>
|
||||
<a href="shape-image-004.xht">shape-image-004</a></strong></td>
|
||||
<td><a href="reference/shape-image-000-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>Image shape on a left float
|
||||
<ul class="assert">
|
||||
<li>This test verifies that a shape specified as a png image with 50% alpha and 0.6 shape-image-threshold creates a proper shape.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-005-4" class="primary ahem image">
|
||||
<td><strong>
|
||||
<a href="shape-image-005.xht">shape-image-005</a></strong></td>
|
||||
<td><a href="reference/shape-image-002-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>Image shape on a left float
|
||||
<ul class="assert">
|
||||
<li>This test verifies that a shape specified as a svg image in a data uri with 70% alpha and 0.8 shape-image-threshold creates a proper shape.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-006-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-006.xht">shape-image-006</a></strong></td>
|
||||
<td><a href="reference/shape-image-006-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, url(png), real image + shape-margin (px)
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps around all the image pixels + the shape-margin when shape-outside is given a png file.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-007-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-007.xht">shape-image-007</a></strong></td>
|
||||
<td><a href="reference/shape-image-007-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, url(svg), real image + shape-margin (px)
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps around all the image pixels + the shape-margin when shape-outside is given an svg file.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-008-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-008.xht">shape-image-008</a></strong></td>
|
||||
<td><a href="reference/shape-image-008-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, url(jpg), data uri + shape-margin (%)
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps around all the image pixels + the shape-margin as a percentage when shape-outside is given an jpg data uri.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-009-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-009.xht">shape-image-009</a></strong></td>
|
||||
<td><a href="reference/shape-image-006-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, url(png), real image 70% + shape-image-threshold + shape-margin (px)
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps around the image pixels extracted from a shape-outside png file with shape-image-threshold set + the shape-margin in absolute length.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-010-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-010.xht">shape-image-010</a></strong></td>
|
||||
<td><a href="reference/shape-image-006-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, url(png), data uri + shape-image-threshold + shape-margin (%)
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps around the image pixels extracted from a shape-outside png file with shape-image-threshold set + the shape-margin as a percentage.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-011-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-011.xht">shape-image-011</a></strong></td>
|
||||
<td><a href="reference/shape-image-007-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, url(svg), real image + shape-image-threshold + shape-margin (px)
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps around the image pixels extracted from a shape-outside svg file with shape-image-threshold set + the shape-margin in absolute length.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-012-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-012.xht">shape-image-012</a></strong></td>
|
||||
<td><a href="reference/shape-image-012-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>Wrapping content around right floating actual jpg image
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps around all the image pixels when shape-outside is given a jpg.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-013-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-013.xht">shape-image-013</a></strong></td>
|
||||
<td><a href="reference/shape-image-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>Wrapping content around shape given by a right floating png
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps around the shape defined by the data uri png.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-014-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-014.xht">shape-image-014</a></strong></td>
|
||||
<td><a href="reference/shape-image-002-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>Wrapping content around shape given by a right floating svg file
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps around the shape defined by an svg file.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-015-4" class="primary ahem image">
|
||||
<td><strong>
|
||||
<a href="shape-image-015.xht">shape-image-015</a></strong></td>
|
||||
<td><a href="reference/shape-image-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>Image shape on a right float
|
||||
<ul class="assert">
|
||||
<li>This test verifies that a shape specified as a png image with 20% alpha and 0.2 shape-image-threshold creates a proper shape.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-016-4" class="primary ahem image">
|
||||
<td><strong>
|
||||
<a href="shape-image-016.xht">shape-image-016</a></strong></td>
|
||||
<td><a href="reference/shape-image-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>Image shape on a right float
|
||||
<ul class="assert">
|
||||
<li>This test verifies that a shape specified as a png image with 70% alpha and 0.71 shape-image-threshold creates a proper shape.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-017-4" class="primary ahem image">
|
||||
<td><strong>
|
||||
<a href="shape-image-017.xht">shape-image-017</a></strong></td>
|
||||
<td><a href="reference/shape-image-002-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
<td>Image shape on a right float
|
||||
<ul class="assert">
|
||||
<li>This test verifies that a shape specified as a data uri svg with 70% alpha creates a proper shape, shape-image-threshold is defined to 0.71.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-018-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-018.xht">shape-image-018</a></strong></td>
|
||||
<td><a href="reference/shape-image-018-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, url(jpg), real image + shape-margin (%)
|
||||
<ul class="assert">
|
||||
<li>This test verifies that the boundary of a shape-outside defined by a JPEG image file is the same as the image's dimensions + shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-019-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-019.xht">shape-image-019</a></strong></td>
|
||||
<td><a href="reference/shape-image-019-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, url(png), data uri + shape-margin (px)
|
||||
<ul class="assert">
|
||||
<li>This test verifies the boundary of a shape-outside defined by a PNG data URI and a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-020-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-020.xht">shape-image-020</a></strong></td>
|
||||
<td><a href="reference/shape-image-020-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, url(svg), data uri + shape-margin (%)
|
||||
<ul class="assert">
|
||||
<li>This test verifies the boundary of a shape-outside defined by an SVG URI and a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-021-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-021.xht">shape-image-021</a></strong></td>
|
||||
<td><a href="reference/shape-image-021-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, url(png), real image + shape-image-threshold + shape-margin (%)
|
||||
<ul class="assert">
|
||||
<li>This test verifies that the boundary of a shape-outside defined by a PNG image file and shape-margin is correct.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-022-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-022.xht">shape-image-022</a></strong></td>
|
||||
<td><a href="reference/shape-image-022-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, url(gif), real image + shape-image-threshold + shape-margin (px)
|
||||
<ul class="assert">
|
||||
<li>This test verifies that the boundary of a shape-outside defined by a GIF image file and shape-margin is correct.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-023-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-023.xht">shape-image-023</a></strong></td>
|
||||
<td><a href="reference/shape-image-023-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, url(svg), data uri + shape-image-threshold + shape-margin (%)
|
||||
<ul class="assert">
|
||||
<li>This test verifies the boundary of a shape-outside defined by an SVG URI, shape-image-threshold, and a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-024-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-024.xht">shape-image-024</a></strong></td>
|
||||
<td><a href="reference/shape-image-024-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>shape-outside from img element with different size than the image file
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps around all the image pixels calculated from the size of the img element, which is different than the size of the image itself.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-image-025-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-image-025.xht">shape-image-025</a></strong></td>
|
||||
<td><a href="reference/shape-image-025-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>shape-outside from first frame of animated gif
|
||||
<ul class="assert">
|
||||
<li>This test verifies that shape-outside is extracted from the first frame of an animated gif.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-010-4" class="primary ahem dom script">
|
||||
<td><strong>
|
||||
<a href="shape-outside-010.xht">shape-outside-010</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
<td>Shape from image - url(), alpha channel, opacity 0
|
||||
<ul class="assert">
|
||||
<li>This test verifies that the content flows around the shape defined in the images alpha channel that is completely transparent.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-011-4" class="primary ahem dom script">
|
||||
<td><strong>
|
||||
<a href="shape-outside-011.xht">shape-outside-011</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
<td>Shape from image - url(), alpha channel, opacity > 0
|
||||
<ul class="assert">
|
||||
<li>This test verifies that the content flows around the shape defined in the images alpha channel that has some opacity.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-012-4" class="primary ahem dom script">
|
||||
<td><strong>
|
||||
<a href="shape-outside-012.xht">shape-outside-012</a></strong></td>
|
||||
<td><a href="reference/shape-outside-012-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
<td>Shape from image - shape-image-threshold - 0.9
|
||||
<ul class="assert">
|
||||
<li>This test verifies content flows around a shape that is defined in the image's alpha channel and adjusted by the image-threshold</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-013-4" class="primary ahem dom script">
|
||||
<td><strong>
|
||||
<a href="shape-outside-013.xht">shape-outside-013</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
<td>Shape from image - shape-margin
|
||||
<ul class="assert">
|
||||
<li>This test verifies that the content flows around the shape defined in the images alpha channel and adjusted by the shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-019-4" class="primary ahem dom script">
|
||||
<td><strong>
|
||||
<a href="shape-outside-019.xht">shape-outside-019</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
<td>Shape from image - alpha channel, opacity > 0 + shape-margin
|
||||
<ul class="assert">
|
||||
<li>This test verifies that the content flows around the shape defined in the images alpha channel and the shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-linear-gradient-001-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-linear-gradient-001.xht">shape-outside-linear-gradient-001</a></strong></td>
|
||||
<td><a href="reference/shape-outside-linear-gradient-001-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>Left float with linear gradient
|
||||
<ul class="assert">
|
||||
<li>This test verifies that shape-outside respects a simple linear gradient.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-linear-gradient-002-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-linear-gradient-002.xht">shape-outside-linear-gradient-002</a></strong></td>
|
||||
<td><a href="reference/shape-outside-linear-gradient-002-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>Right float with linear gradient
|
||||
<ul class="assert">
|
||||
<li>This test verifies that shape-outside respects a simple linear gradient on a right float.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-linear-gradient-003-4" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-linear-gradient-003.xht">shape-outside-linear-gradient-003</a></strong></td>
|
||||
<td><a href="reference/shape-outside-linear-gradient-002-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>Right float with linear gradient
|
||||
<ul class="assert">
|
||||
<li>This test verifies that shape-outside respects a simple linear gradient on a right float with shape-margin applied.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-linear-gradient-004-4" class="primary">
|
||||
<td><strong>
|
||||
<a href="shape-outside-linear-gradient-004.xht">shape-outside-linear-gradient-004</a></strong></td>
|
||||
<td><a href="reference/shape-outside-linear-gradient-004-ref.xht">=</a> </td>
|
||||
<td></td>
|
||||
<td>Shape outside and repeating linear gradient
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps correctly around a shape defined by a repeating linear gradient.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-radial-gradient-001-4" class="primary ahem dom">
|
||||
<td><strong>
|
||||
<a href="shape-outside-radial-gradient-001.xht">shape-outside-radial-gradient-001</a></strong></td>
|
||||
<td><a href="reference/shape-outside-radial-gradient-001-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr></td>
|
||||
<td>Left float with radial gradient
|
||||
<ul class="assert">
|
||||
<li>This test verifies that shape-outside respects a simple radial gradient.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-radial-gradient-002-4" class="primary ahem dom">
|
||||
<td><strong>
|
||||
<a href="shape-outside-radial-gradient-002.xht">shape-outside-radial-gradient-002</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr></td>
|
||||
<td>Left float with radial gradient and percentage shape margin
|
||||
<ul class="assert">
|
||||
<li>This test verifies that shape-outside respects a simple radial gradient when a percentage margin is applied.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-radial-gradient-003-4" class="primary ahem dom">
|
||||
<td><strong>
|
||||
<a href="shape-outside-radial-gradient-003.xht">shape-outside-radial-gradient-003</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr></td>
|
||||
<td>Left float with radial gradient shape, shape margin, and shape-image-threshold
|
||||
<ul class="assert">
|
||||
<li>This test verifies that shape-outside respects a simple radial gradient when a shape margin and shape-image threshold are applied.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-radial-gradient-004-4" class="primary ahem dom">
|
||||
<td><strong>
|
||||
<a href="shape-outside-radial-gradient-004.xht">shape-outside-radial-gradient-004</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr></td>
|
||||
<td>Left float with radial gradient shape, shape margin, and shape-image-threshold
|
||||
<ul class="assert">
|
||||
<li>This test verifies that shape-outside respects a simple radial gradient on a right float when shape-image-threshold is applied.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
648
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/chapter-5.xht
Normal file
648
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/chapter-5.xht
Normal file
|
|
@ -0,0 +1,648 @@
|
|||
|
||||
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>Shapes from Box Values - CSS Shapes Module Level 1 CR Test Suite</title>
|
||||
<style type="text/css">
|
||||
@import "http://www.w3.org/StyleSheets/TR/base.css";
|
||||
@import "../indices.css";
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<h1>CSS Shapes Module Level 1 CR Test Suite</h1>
|
||||
<h2>Shapes from Box Values (48 tests)</h2>
|
||||
<table width="100%">
|
||||
<col id="test-column"></col>
|
||||
<col id="refs-column"></col>
|
||||
<col id="flags-column"></col>
|
||||
<col id="info-column"></col>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Test</th>
|
||||
<th><abbr title="Rendering References">Refs</abbr></th>
|
||||
<th>Flags</th>
|
||||
<th>Info</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="s5">
|
||||
<tr><th colspan="4" scope="rowgroup">
|
||||
<a href="#s5">+</a>
|
||||
<a href="http://www.w3.org/TR/css-shapes-1/#shapes-from-box-values">5 Shapes from Box Values</a></th></tr>
|
||||
<!-- 15 tests -->
|
||||
<tr id="shape-outside-014-5" class="primary ahem dom script">
|
||||
<td><strong>
|
||||
<a href="shape-outside-014.xht">shape-outside-014</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
<td>Shape from box value - margin-box
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps around a shape defined by its margin box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-015-5" class="primary ahem dom script">
|
||||
<td><strong>
|
||||
<a href="shape-outside-015.xht">shape-outside-015</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
<td>Shape from box value - border-box
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps around a shape defined by its border box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-016-5" class="primary ahem dom script">
|
||||
<td><strong>
|
||||
<a href="shape-outside-016.xht">shape-outside-016</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
<td>Shape from box value - padding-box
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps around a shape defined by its padding box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-017-5" class="primary ahem dom script">
|
||||
<td><strong>
|
||||
<a href="shape-outside-017.xht">shape-outside-017</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
<td>Shape from box value - content-box
|
||||
<ul class="assert">
|
||||
<li>This test verifies that content wraps around a shape defined by its content box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-018-5" class="primary ahem dom script">
|
||||
<td><strong>
|
||||
<a href="shape-outside-018.xht">shape-outside-018</a></strong></td>
|
||||
<td></td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
<td>shape-margin offset from a polygonal shape-outside
|
||||
<ul class="assert">
|
||||
<li>This test verifies that that content flows around the shape-margin defined on a polygonal shape-outside.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-box-002-5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-box-002.xht">shape-outside-box-002</a></strong></td>
|
||||
<td><a href="reference/shape-outside-box-001-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, shape-outside: content-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as the content box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-box-003-5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-box-003.xht">shape-outside-box-003</a></strong></td>
|
||||
<td><a href="reference/shape-outside-box-001-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, shape-outside: border-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as the border box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-box-004-5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-box-004.xht">shape-outside-box-004</a></strong></td>
|
||||
<td><a href="reference/shape-outside-box-001-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, shape-outside: padding-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as the padding box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-box-006-5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-box-006.xht">shape-outside-box-006</a></strong></td>
|
||||
<td><a href="reference/shape-outside-box-005-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, shape-outside: content-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as the content box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-box-007-5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-box-007.xht">shape-outside-box-007</a></strong></td>
|
||||
<td><a href="reference/shape-outside-box-005-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, shape-outside: border-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as the border box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-box-008-5" class="primary ahem">
|
||||
<td><strong>
|
||||
<a href="shape-outside-box-008.xht">shape-outside-box-008</a></strong></td>
|
||||
<td><a href="reference/shape-outside-box-005-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, shape-outside: padding-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as the padding box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-inset-012-5" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-inset-012.xht">shape-outside-inset-012</a></td>
|
||||
<td><a href="reference/shape-outside-inset-010-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, inset + margin-box
|
||||
<ul class="assert">
|
||||
<li>The test verfies that text flows around a left float with a shape-outside defined as an inset rectangle + margin-box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-inset-013-5" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-inset-013.xht">shape-outside-inset-013</a></td>
|
||||
<td><a href="reference/shape-outside-inset-010-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, inset + border-box
|
||||
<ul class="assert">
|
||||
<li>The test verfies that text flows around a left float with a shape-outside defined as an inset rectangle + border-box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-inset-014-5" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-inset-014.xht">shape-outside-inset-014</a></td>
|
||||
<td><a href="reference/shape-outside-inset-010-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, inset + content-box
|
||||
<ul class="assert">
|
||||
<li>The test verfies that text flows around a left float with a shape-outside defined as an inset rectangle + content-box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-inset-015-5" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-inset-015.xht">shape-outside-inset-015</a></td>
|
||||
<td><a href="reference/shape-outside-inset-010-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, inset + padding-box
|
||||
<ul class="assert">
|
||||
<li>The test verfies that text flows around a left float with a shape-outside defined as an inset rectangle + padding-box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="s5.#border-box">
|
||||
<!-- 9 tests -->
|
||||
<tr id="shape-outside-box-003-5.#border-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-box-003.xht">shape-outside-box-003</a></td>
|
||||
<td><a href="reference/shape-outside-box-001-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, shape-outside: border-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as the border box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-box-007-5.#border-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-box-007.xht">shape-outside-box-007</a></td>
|
||||
<td><a href="reference/shape-outside-box-005-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, shape-outside: border-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as the border box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-circle-016-5.#border-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-circle-016.xht">shape-outside-circle-016</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, circle + farthest-side + border-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as a circle with the radius defined as farthest-side from the border box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-circle-020-5.#border-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-circle-020.xht">shape-outside-circle-020</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, circle at % + border-box + shape-margin
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as a circle from the padding box with a position specified as a percentage and with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-circle-024-5.#border-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-circle-024.xht">shape-outside-circle-024</a></td>
|
||||
<td><a href="reference/shape-outside-circle-023-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, circle radius in % units + shape-margin + border-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as a circle from the border box with radius in percentage units and with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-circle-028-5.#border-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-circle-028.xht">shape-outside-circle-028</a></td>
|
||||
<td><a href="reference/shape-outside-circle-023-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, circle(closest-side) at position % + shape-margin + border-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as a circle positioned from the border box with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-polygon-009-5.#border-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-polygon-009.xht">shape-outside-polygon-009</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-007-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, polygon + border box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as an polygon from the border box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-polygon-013-5.#border-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-polygon-013.xht">shape-outside-polygon-013</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-010-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, polygon + border-box + shape-margin
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as an polygon from the border box with a shape margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-polygon-014-5.#border-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-polygon-014.xht">shape-outside-polygon-014</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-010-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, polygon + padding-box + shape-margin
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as an polygon from the padding box with a shape margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="s5.#content-box">
|
||||
<!-- 12 tests -->
|
||||
<tr id="shape-outside-box-002-5.#content-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-box-002.xht">shape-outside-box-002</a></td>
|
||||
<td><a href="reference/shape-outside-box-001-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, shape-outside: content-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as the content box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-box-006-5.#content-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-box-006.xht">shape-outside-box-006</a></td>
|
||||
<td><a href="reference/shape-outside-box-005-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, shape-outside: content-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as the content box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-circle-014-5.#content-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-circle-014.xht">shape-outside-circle-014</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, circle + content-box + radius and position in % units
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as a circle from the content box with the radius and position in percentage units.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-circle-022-5.#content-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-circle-022.xht">shape-outside-circle-022</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, circle at bottom right + content-box + shape-margin
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as a circle from the padding box positioned at center right with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-circle-026-5.#content-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-circle-026.xht">shape-outside-circle-026</a></td>
|
||||
<td><a href="reference/shape-outside-circle-023-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, circle + shape-margin + content-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as a circle from the content box with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-circle-027-5.#content-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-circle-027.xht">shape-outside-circle-027</a></td>
|
||||
<td><a href="reference/shape-outside-circle-023-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, circle with radius in % units + shape-margin + margin-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as a circle positioned from the margin box with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-ellipse-014-5.#content-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-ellipse-014.xht">shape-outside-ellipse-014</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, ellipse radii and position in % units + content-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as a ellipse from the content box with the position and radii in percentage units.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-ellipse-017-5.#content-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-ellipse-017.xht">shape-outside-ellipse-017</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, ellipse(farthest-side) + shape-margin + content-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as a ellipse from the content box with only the rx defined as farthest-side and with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-ellipse-022-5.#content-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-ellipse-022.xht">shape-outside-ellipse-022</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-021-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, ellipse(closest-side px) + shape-margin + content-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as a ellipse from the content box with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-ellipse-024-5.#content-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-ellipse-024.xht">shape-outside-ellipse-024</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-021-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, ellipse at position (%) + shape-margin (%) + border-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as a ellipse positioned from the border box with only the horizontal offset specified in percentage units and with a shape-margin in percentage units.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-polygon-011-5.#content-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-polygon-011.xht">shape-outside-polygon-011</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-010-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, polygon + content box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as an polygon from the content box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-polygon-015-5.#content-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-polygon-015.xht">shape-outside-polygon-015</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-010-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, polygon + content-box + shape-margin
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as an polygon from the content box wtih a shape margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="s5.#margin-box">
|
||||
<!-- 4 tests -->
|
||||
<tr id="shape-outside-circle-013-5.#margin-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-circle-013.xht">shape-outside-circle-013</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, circle + margin-box + position (px)
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as a circle from the margin box and positioned in px units.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-circle-019-5.#margin-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-circle-019.xht">shape-outside-circle-019</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, circle at top left + margin-box + shape-margin
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as a circle from the margin box and is positioned top left with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-ellipse-020-5.#margin-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-ellipse-020.xht">shape-outside-ellipse-020</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, ellipse radii in % units + margin-box + shape-margin
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as a ellipse from the margin box with the radii specified in percentage units and with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-polygon-012-5.#margin-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-polygon-012.xht">shape-outside-polygon-012</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-010-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, polygon + margin-box + shape-margin
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as an polygon from the margin box with a shape margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="s5.#padding-box">
|
||||
<!-- 12 tests -->
|
||||
<tr id="shape-outside-box-004-5.#padding-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-box-004.xht">shape-outside-box-004</a></td>
|
||||
<td><a href="reference/shape-outside-box-001-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, shape-outside: padding-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as the padding box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-box-008-5.#padding-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-box-008.xht">shape-outside-box-008</a></td>
|
||||
<td><a href="reference/shape-outside-box-005-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, shape-outside: padding-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as the padding box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-circle-015-5.#padding-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-circle-015.xht">shape-outside-circle-015</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, circle + closest-side + padding-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as a circle with the radius explicitly set as closest-side from the padding box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-circle-021-5.#padding-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-circle-021.xht">shape-outside-circle-021</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, circle + farthest-side + padding-box + shape-margin
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as a circle with a farthest-side radius from the padding box with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-circle-025-5.#padding-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-circle-025.xht">shape-outside-circle-025</a></td>
|
||||
<td><a href="reference/shape-outside-circle-023-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, circle + shape-margin + padding-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as a circle from the padding box with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-circle-029-5.#padding-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-circle-029.xht">shape-outside-circle-029</a></td>
|
||||
<td><a href="reference/shape-outside-circle-023-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, circle at center right + shape-margin + padding-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as a circle positioned center right from the padding box with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-ellipse-015-5.#padding-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-ellipse-015.xht">shape-outside-ellipse-015</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, ellipse + closest-side + padding-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as an ellipse with the radii explicitly set as closest-side from the padding box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-ellipse-016-5.#padding-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-ellipse-016.xht">shape-outside-ellipse-016</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, ellipse radii in % units + padding-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as a ellipse from the padding box with the radii in percentage units.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-ellipse-019-5.#padding-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-ellipse-019.xht">shape-outside-ellipse-019</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-013-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, ellipse radii in % units + padding-box + shape-margin
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as a ellipse from the padding box with radii in percentage units and with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-ellipse-021-5.#padding-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-ellipse-021.xht">shape-outside-ellipse-021</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-021-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, ellipse (closest-side px) + shape-margin + padding box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as a ellipse from the padding box with rx explicitly set at closest-side and ry in px units and with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-ellipse-025-5.#padding-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-ellipse-025.xht">shape-outside-ellipse-025</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-021-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>right float, ellipse radii in % at center right + shape-margin + padding-box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a right float with a shape-outside defined as a ellipse with the radii in percentage units positioned at center right from the margin box with a shape-margin.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-polygon-010-5.#padding-box" class="ahem">
|
||||
<td>
|
||||
<a href="shape-outside-polygon-010.xht">shape-outside-polygon-010</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-010-ref.xht">=</a> </td>
|
||||
<td><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
<td>left float, polygon + padding box
|
||||
<ul class="assert">
|
||||
<li>The test verifies that text wraps around a left float with a shape-outside defined as an polygon from the padding box.</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="s5.#typedef-shape-box">
|
||||
<!-- 2 tests -->
|
||||
<tr id="shape-outside-box-000-5.#typedef-shape-box" class="dom script">
|
||||
<td>
|
||||
<a href="shape-outside-box-000.xht">shape-outside-box-000</a></td>
|
||||
<td></td>
|
||||
<td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
<td>Shape Outside Box Valid Values
|
||||
<ul class="assert">
|
||||
<li>Shape-outside may be one of the box model box values</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="shape-outside-shape-box-pair-000-5.#typedef-shape-box" class="dom script">
|
||||
<td>
|
||||
<a href="shape-outside-shape-box-pair-000.xht">shape-outside-shape-box-pair-000</a></td>
|
||||
<td></td>
|
||||
<td><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
<td>Shape Outside Box Shape and Box Valid Values
|
||||
<ul class="assert">
|
||||
<li>Shape-outside may be a pair of shape and box values</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
2482
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/chapter-6.xht
Normal file
2482
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/chapter-6.xht
Normal file
File diff suppressed because it is too large
Load diff
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="bjonesbe@adobe.com" rel="author" title="Bem Jones-Bey" />
|
||||
<style type="text/css">
|
||||
.container {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
img {
|
||||
float: left;
|
||||
}
|
||||
.green {
|
||||
position: relative;
|
||||
left: 50px;
|
||||
width: 50px;
|
||||
height: 100px;
|
||||
background: rgb(0, 100, 0);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if you see a solid green square. There should be no red.
|
||||
</p>
|
||||
<div class="container">
|
||||
<img src="../support/left-half-rectangle-50.png" />
|
||||
<div class="green"></div>
|
||||
</div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="bjonesbe@adobe.com" rel="author" title="Bem Jones-Bey" />
|
||||
<style type="text/css">
|
||||
.container {
|
||||
width: 150px;
|
||||
height: 100px;
|
||||
background-color: black;
|
||||
}
|
||||
img {
|
||||
float: left;
|
||||
}
|
||||
.green {
|
||||
float: right;
|
||||
width: 50px;
|
||||
height: 100px;
|
||||
background-color: rgb(0, 100, 0);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if you see a green rectangle, a black rectangle, and a green rectangle next to each other. There should be no red.
|
||||
</p>
|
||||
<div class="container">
|
||||
<img src="../support/left-half-rectangle-70.png" />
|
||||
<div class="green"></div>
|
||||
</div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="bjonesbe@adobe.com" rel="author" title="Bem Jones-Bey" />
|
||||
<style type="text/css">
|
||||
.container {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background: rgb(0, 100, 0);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if you see a solid green square. There should be no red.
|
||||
</p>
|
||||
<div class="container">
|
||||
</div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style type="text/css">
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
.green, .blue {
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
}
|
||||
.left-rect {
|
||||
left: 10px;
|
||||
}
|
||||
.right-rect {
|
||||
width: 50px;
|
||||
height: 100px;
|
||||
left: 70px;
|
||||
background: rgb(0,100,0);
|
||||
}
|
||||
.blue {
|
||||
width: 2px;
|
||||
height: 100px;
|
||||
background-color: blue;
|
||||
}
|
||||
.left-line { left: 65px; }
|
||||
.right-line { left: 125px }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if the green rectangle on the right is completely between the two blue lines.
|
||||
There should be no red.
|
||||
</p>
|
||||
<div class="green left-rect">
|
||||
<img src="../support/left-half-rectangle.png" />
|
||||
</div>
|
||||
<div class="green right-rect"></div>
|
||||
<div class="blue left-line"></div>
|
||||
<div class="blue right-line"></div>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style type="text/css">
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
.green {
|
||||
background-color: rgb(0,100,0);
|
||||
width: 50px;
|
||||
height: 100px;
|
||||
}
|
||||
.left-rect { left: 10px; }
|
||||
.right-rect { left: 70px; }
|
||||
|
||||
.blue {
|
||||
width: 2px;
|
||||
height: 100px;
|
||||
background-color: blue;
|
||||
}
|
||||
.left-line { left: 65px; }
|
||||
.right-line { left: 125px }
|
||||
|
||||
.green, .blue {
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if the green rectangle on the right is completely between the two blue lines.
|
||||
There should be no red.
|
||||
</p>
|
||||
<div class="green left-rect"></div>
|
||||
<div class="green right-rect"></div>
|
||||
<div class="blue left-line"></div>
|
||||
<div class="blue right-line"></div>
|
||||
|
||||
</body></html>
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="zoltan@adobe.com" rel="author" title="Zoltan Horvath" />
|
||||
<style type="text/css">
|
||||
.container {
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
left: 8px;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
font-family: Ahem;
|
||||
font-size: 20px;
|
||||
line-height: 20px;
|
||||
text-align: right;
|
||||
color: green;
|
||||
}
|
||||
#image { float: right; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if there's a green square with an image at top right with vertical white and green stripes.
|
||||
There should be no red.
|
||||
</p>
|
||||
<div class="container">
|
||||
<img src="../support/right-half-rectangle.jpg" id="image" />
|
||||
XXXXX XXXXX XXXXX XXXXX XXXXX
|
||||
XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX
|
||||
</div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="bjonesbe@adobe.com" rel="author" title="Bem Jones-Bey" />
|
||||
<style type="text/css">
|
||||
.container {
|
||||
width: 150px;
|
||||
height: 100px;
|
||||
}
|
||||
img {
|
||||
position: relative;
|
||||
left: -50px;
|
||||
}
|
||||
.green {
|
||||
float: left;
|
||||
width: 50px;
|
||||
height: 100px;
|
||||
background: rgb(0, 100, 0);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if you see a solid green square. There should be no red.
|
||||
</p>
|
||||
<div class="container">
|
||||
<div class="green"></div>
|
||||
<img src="../support/right-half-rectangle.png" />
|
||||
</div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="hmuller@adobe.com" rel="author" title="Hans Muller" />
|
||||
<style type="text/css">
|
||||
#container {
|
||||
position: relative;
|
||||
width: 200px;
|
||||
font-family: Ahem;
|
||||
font-size: 40px;
|
||||
text-align: right;
|
||||
color: green;
|
||||
}
|
||||
#image {
|
||||
float: right;
|
||||
margin-left: 20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>The test passes if no red is visible.</p>
|
||||
<div id="container">
|
||||
<img src="../support/left-half-rectangle.jpg" id="image" />
|
||||
X<br />X<br />X<br />X
|
||||
</div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="hmuller@adobe.com" rel="author" title="Hans Muller" />
|
||||
<style type="text/css">
|
||||
#container {
|
||||
position: relative;
|
||||
width: 200px;
|
||||
font-family: Ahem;
|
||||
font-size: 40px;
|
||||
text-align: right;
|
||||
color: green;
|
||||
}
|
||||
#image {
|
||||
float: right;
|
||||
margin-left: 10px;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>The two green squares should appear 10 pixels to the left of and 10 pixels below the blue square, respectively. The test passes if no red is visible.</p>
|
||||
<div id="container">
|
||||
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAK0lEQVQ4T2NkYPj/n4GKgHHUQIpDczQMKQ5ChtEwHA1DMkJgNNmQEWhoWgAkKift4VBlVgAAAABJRU5ErkJggg==" id="image" />
|
||||
X<br />X
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="hmuller@adobe.com" rel="author" title="Hans Muller" />
|
||||
<style type="text/css">
|
||||
#container {
|
||||
position: relative;
|
||||
width: 200px;
|
||||
font-family: Ahem;
|
||||
font-size: 40px;
|
||||
text-align: right;
|
||||
color: green;
|
||||
}
|
||||
#image {
|
||||
float: right;
|
||||
margin-left: 10px;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>The two green squares should appear 10 pixels to the left of and 10 pixels below the blue square, respectively. The test passes if no red is visible.</p>
|
||||
<div id="container">
|
||||
<img src="data:image/svg+xml;utf8,<svg width='20px' height='20px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' fill='blue'/></svg>" id="image" />
|
||||
X<br />X
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="hmuller@adobe.com" rel="author" title="Hans Muller" />
|
||||
<style type="text/css">
|
||||
#container {
|
||||
position: relative;
|
||||
width: 200px;
|
||||
padding-left: 90px;
|
||||
font-family: Ahem;
|
||||
font-size: 40px;
|
||||
color: green;
|
||||
}
|
||||
#image {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 100px;
|
||||
float: right;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>The test passes if no red is visible.</p>
|
||||
<div id="container">
|
||||
<img src="../support/right-half-rectangle.png" id="image" />
|
||||
X<br />X<br />X<br /><span style="padding-left: 70px">X</span>
|
||||
</div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="hmuller@adobe.com" rel="author" title="Hans Muller" />
|
||||
<style type="text/css">
|
||||
#container {
|
||||
position: relative;
|
||||
width: 200px;
|
||||
padding-left: 90px;
|
||||
font-family: Ahem;
|
||||
font-size: 40px;
|
||||
color: green;
|
||||
}
|
||||
#image {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 100px;
|
||||
float: right;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>The test passes if no red is visible.</p>
|
||||
<div id="container">
|
||||
<img src="../support/right-half-rectangle.gif" id="image" />
|
||||
X<br />X<br />X<br /><span style="padding-left: 70px">X</span>
|
||||
</div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="hmuller@adobe.com" rel="author" title="Hans Muller" />
|
||||
<style type="text/css">
|
||||
#container {
|
||||
position: relative;
|
||||
width: 200px;
|
||||
font-family: Ahem;
|
||||
font-size: 40px;
|
||||
text-align: right;
|
||||
color: green;
|
||||
}
|
||||
#image {
|
||||
float: right;
|
||||
margin-left: 10px;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>The two green squares should appear 10 pixels to the left of and 10 pixels below the blue square, respectively. The test passes if no red is visible.</p>
|
||||
<div id="container">
|
||||
<img src="data:image/svg+xml;utf8,<svg width='20px' height='20px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' fill='blue'/></svg>" id="image" />
|
||||
X<br />X
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style type="text/css">
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
.green {
|
||||
background-color: rgb(0,100,0);
|
||||
width: 100px;
|
||||
height: 200px;
|
||||
}
|
||||
.left-rect { left: 10px; }
|
||||
.right-rect { left: 120px; }
|
||||
|
||||
.blue {
|
||||
width: 2px;
|
||||
height: 200px;
|
||||
background-color: blue;
|
||||
}
|
||||
.left-line { left: 115px; }
|
||||
.right-line { left: 230px }
|
||||
|
||||
.green, .blue {
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if the green rectangle on the right is completely between the two blue lines.
|
||||
There should be no red.
|
||||
</p>
|
||||
<div class="green left-rect"></div>
|
||||
<div class="green right-rect"></div>
|
||||
<div class="blue left-line"></div>
|
||||
<div class="blue right-line"></div>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,34 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style type="text/css">
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
.green {
|
||||
top: 70px;
|
||||
left: 10px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-color: rgb(0,100,0);
|
||||
}
|
||||
.blue {
|
||||
top: 50px;
|
||||
left: 60px;
|
||||
width: 2px;
|
||||
height: 140px;
|
||||
background-color: blue;
|
||||
}
|
||||
.green, .blue { position: absolute; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if there are two identical green rectangles on either side of the blue line.
|
||||
There should be no red.
|
||||
</p>
|
||||
<div class="green"></div>
|
||||
<div class="blue"></div>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,83 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style type="text/css">
|
||||
body {
|
||||
margin-left: 0;
|
||||
}
|
||||
#container {
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
text-align: center;
|
||||
font-family: Ahem;
|
||||
font-size: 20px;
|
||||
color: green;
|
||||
line-height: 1em;
|
||||
}
|
||||
#level-1 {
|
||||
width: 400px;
|
||||
height: 80px;
|
||||
}
|
||||
#level-2 {
|
||||
width: 200px;
|
||||
height: 40px;
|
||||
margin-left: 100px;
|
||||
}
|
||||
#level-3 {
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
margin-left: 150px;
|
||||
}
|
||||
#level-4 {
|
||||
width: 50px;
|
||||
height: 20px;
|
||||
margin-left: 175px;
|
||||
}
|
||||
#level5 {
|
||||
width: 400px;
|
||||
height: 20px;
|
||||
}
|
||||
#left-triangle, #right-triangle {
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background-color: lightblue;
|
||||
}
|
||||
#left-triangle {
|
||||
clip-path: polygon(0 0, 200px 200px, 0 200px);
|
||||
}
|
||||
#right-triangle {
|
||||
left: 200px;
|
||||
clip-path: polygon(200px 0, 200px 200px, 0 200px);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if the green shape does not intersect either of the triangles and
|
||||
there is one green horizontal bar beneath the triangles. There should be no red.
|
||||
</p>
|
||||
<div id="container">
|
||||
<div id="level-1">
|
||||
XXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXX XXXXXXXXXXXXX XXXXXXXXXXX
|
||||
</div>
|
||||
<div id="level-2">
|
||||
XXXXXXXXX XXXXXXX
|
||||
</div>
|
||||
<div id="level-3">
|
||||
XXXXX XXX
|
||||
</div>
|
||||
<div id="level-4">
|
||||
X
|
||||
</div>
|
||||
<br />
|
||||
<div id="level-5">
|
||||
XXXXXXXXXXXXXXXXX
|
||||
</div>
|
||||
</div>
|
||||
<div id="left-triangle"></div>
|
||||
<div id="right-triangle"></div>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style type="text/css">
|
||||
#container {
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
width: 400px;
|
||||
font-family: Ahem;
|
||||
font-size: 20px;
|
||||
line-height: 1.5em;
|
||||
color: green;
|
||||
}
|
||||
#square{
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
width: 196px;
|
||||
height: 196px;
|
||||
border: 1px solid black;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if there are two columns of six green horizontal bars of the same
|
||||
size inside the square and two columns of six matching green bars outside and to the
|
||||
right of the square. There should be no red.
|
||||
</p>
|
||||
<div id="container">
|
||||
XXXX XXXX XXXX XXXX
|
||||
XXXX XXXX XXXX XXXX
|
||||
XXXX XXXX XXXX XXXX
|
||||
XXXX XXXX XXXX XXXX
|
||||
XXXX XXXX XXXX XXXX
|
||||
XXXX XXXX XXXX XXXX
|
||||
</div>
|
||||
<div id="square"></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,56 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style type="text/css">
|
||||
#container {
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
width: 250px;
|
||||
height: 105px;
|
||||
border: 1px solid black;
|
||||
}
|
||||
.bar {
|
||||
position: absolute;
|
||||
height: 20px;
|
||||
background-color: green;
|
||||
}
|
||||
#line-1 {
|
||||
top: 10px;
|
||||
left: 65px;
|
||||
width: 160px;
|
||||
}
|
||||
#line-2 {
|
||||
top: 40px;
|
||||
left: 80px;
|
||||
width: 140px;
|
||||
}
|
||||
#line-3 {
|
||||
top: 70px;
|
||||
left: 95px;
|
||||
width: 120px;
|
||||
}
|
||||
#triangle {
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-color: lightblue;
|
||||
clip-path: polygon(50px 0px, 100px 100px, 0px 100px);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if all there are three green horizontal bars to the right of the
|
||||
triangle that are all inside the rectangle and there should be no green to the left
|
||||
of the triangle. There should be no red.
|
||||
</p>
|
||||
<div id="container">
|
||||
<div class="bar" id="line-1"></div>
|
||||
<div class="bar" id="line-2"></div>
|
||||
<div class="bar" id="line-3"></div>
|
||||
</div>
|
||||
<div id="triangle"></div>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,71 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style type="text/css">
|
||||
#container {
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
width: 260px;
|
||||
height: 120px;
|
||||
font-family: Ahem;
|
||||
font-size: 20px;
|
||||
line-height: 1.5em;
|
||||
border: 1px solid black;
|
||||
padding-left: 2px;
|
||||
}
|
||||
#margin-line {
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
width: 263px;
|
||||
border-bottom: 1px solid black;
|
||||
}
|
||||
.bar {
|
||||
position: absolute;
|
||||
height: 20px;
|
||||
background-color: green;
|
||||
}
|
||||
#bar-1 {
|
||||
top: 5px;
|
||||
width: 240px;
|
||||
}
|
||||
#bar-2 {
|
||||
top: 35px;
|
||||
width: 240px;
|
||||
}
|
||||
#bar-3 {
|
||||
top: 65px;
|
||||
left: 22px;
|
||||
width: 220px;
|
||||
}
|
||||
#bar-4 {
|
||||
top: 95px;
|
||||
left: 52px;
|
||||
width: 200px;
|
||||
}
|
||||
#triangle {
|
||||
position: absolute;
|
||||
top: 90px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-color: lightblue;
|
||||
margin-left: 2px;
|
||||
clip-path: polygon(0% 50%, 50% 100%, 0 100%);;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if one green bar is inside the top rectangle, three green bars
|
||||
are in the bottom rectangle, and none intersect the triangle. There should be no red.
|
||||
</p>
|
||||
<div id="container">
|
||||
<div class="bar" id="bar-1"></div>
|
||||
<div class="bar" id="bar-2"></div>
|
||||
<div class="bar" id="bar-3"></div>
|
||||
<div class="bar" id="bar-4"></div>
|
||||
</div>
|
||||
<div id="margin-line"></div>
|
||||
<div id="triangle"></div>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,88 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style type="text/css">
|
||||
#container {
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
width: 262px;
|
||||
height: 150px;
|
||||
border: 1px solid black;
|
||||
}
|
||||
#failure-container {
|
||||
|
||||
}
|
||||
#margin-line {
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
width: 263px;
|
||||
border-bottom: 1px solid black;
|
||||
}
|
||||
.fail {
|
||||
position: absolute;
|
||||
height: 15px;
|
||||
background-color: green;
|
||||
z-index: -1;
|
||||
}
|
||||
#bar-1 {
|
||||
top: 7px;
|
||||
left: 2px;
|
||||
width: 255px;
|
||||
}
|
||||
#bar-2 {
|
||||
top: 37px;
|
||||
left: 2px;
|
||||
width: 255px;
|
||||
}
|
||||
#bar-3 {
|
||||
top: 67px;
|
||||
left: 22px;
|
||||
width: 225px;
|
||||
}
|
||||
#bar-4 {
|
||||
top: 97px;
|
||||
left: 122px;
|
||||
width: 135px;
|
||||
}
|
||||
#bar-5 {
|
||||
top: 127px;
|
||||
left: 152px;
|
||||
width: 105px;
|
||||
}
|
||||
.triangle {
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-color: lightblue;
|
||||
clip-path: polygon(0% 50%, 50% 100%, 0 100%);;
|
||||
|
||||
}
|
||||
#triangle-1 {
|
||||
top: 90px;
|
||||
margin-left: 2px;
|
||||
}
|
||||
#triangle-2 {
|
||||
top: 120px;
|
||||
margin-left: 102px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if one green bar is inside the top rectangle, four green bars
|
||||
are in the bottom rectangle, and none intersect the triangles. There should be no
|
||||
red.
|
||||
</p>
|
||||
<div id="container">
|
||||
<div class="fail" id="bar-1"></div>
|
||||
<div class="fail" id="bar-2"></div>
|
||||
<div class="fail" id="bar-3"></div>
|
||||
<div class="fail" id="bar-4"></div>
|
||||
<div class="fail" id="bar-5"></div>
|
||||
</div>
|
||||
<div id="margin-line"></div>
|
||||
<div class="triangle" id="triangle-1"></div>
|
||||
<div class="triangle" id="triangle-2"></div>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
#container {
|
||||
position: relative;
|
||||
}
|
||||
#line {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 198px;
|
||||
width: 2px;
|
||||
height: 200px;
|
||||
border-left: 2px solid blue;
|
||||
}
|
||||
#square {
|
||||
position: absolute;
|
||||
top: 80px;
|
||||
left: 200px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background-color: green;
|
||||
}
|
||||
</style></head>
|
||||
|
||||
<body>
|
||||
<p>The test passes if there is a green square to the right of the blue line. There should be no red.</p>
|
||||
<div id="container">
|
||||
<div id="line"></div>
|
||||
<div id="square"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
#container {
|
||||
position: relative;
|
||||
}
|
||||
#line {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 100px;
|
||||
width: 2px;
|
||||
height: 200px;
|
||||
border-left: 2px solid blue;
|
||||
}
|
||||
#square {
|
||||
position: absolute;
|
||||
top: 80px;
|
||||
left: 60px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background-color: green;
|
||||
}
|
||||
</style></head>
|
||||
|
||||
<body>
|
||||
<p>The test passes if there is a green square to the left of the blue line. There should be no red.</p>
|
||||
<div id="container">
|
||||
<div id="line"></div>
|
||||
<div id="square"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
#container {
|
||||
position: relative;
|
||||
}
|
||||
#line {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 168px;
|
||||
width: 2px;
|
||||
height: 200px;
|
||||
border-left: 2px solid blue;
|
||||
}
|
||||
#square {
|
||||
position: absolute;
|
||||
top: 80px;
|
||||
left: 170px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background-color: green;
|
||||
}
|
||||
</style></head>
|
||||
|
||||
<body>
|
||||
<p>The test passes if there is a green square to the right of the blue line. There should be no red.</p>
|
||||
<div id="container">
|
||||
<div id="line"></div>
|
||||
<div id="square"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
#container {
|
||||
position: relative;
|
||||
}
|
||||
#line {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 140px;
|
||||
width: 2px;
|
||||
height: 200px;
|
||||
border-left: 2px solid blue;
|
||||
}
|
||||
#square {
|
||||
position: absolute;
|
||||
top: 80px;
|
||||
left: 100px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background-color: green;
|
||||
}
|
||||
</style></head>
|
||||
|
||||
<body>
|
||||
<p>The test passes if there is a green square to the left of the blue line. There should be no red.</p>
|
||||
<div id="container">
|
||||
<div id="line"></div>
|
||||
<div id="square"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
.container {
|
||||
position: relative;
|
||||
font: 15px Ahem, sans-serif;
|
||||
line-height: 20px;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
color: green;
|
||||
}
|
||||
.circle {
|
||||
z-index: -1;
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
border-radius: 80px;
|
||||
background-color: blue;
|
||||
overflow: hidden;
|
||||
}
|
||||
#left-circle-outline {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 0px;
|
||||
}
|
||||
.left-circle-float-line {
|
||||
float: left;
|
||||
clear: left;
|
||||
height: 20px;
|
||||
}
|
||||
</style></head>
|
||||
|
||||
<body>
|
||||
<p>The test passes if all of the squares are green. There should be no red.</p>
|
||||
<div class="container">
|
||||
X<br />
|
||||
<div id="left-circle-outline"></div>
|
||||
<!-- generated left-rounded-rect-float-line divs will be inserted here -->
|
||||
X<br />
|
||||
X<br />
|
||||
X<br />
|
||||
X<br />
|
||||
X<br />
|
||||
X<br />
|
||||
X<br />
|
||||
X<br />
|
||||
X
|
||||
</div>
|
||||
|
||||
<script src="../../support/rounded-rectangle.js"></script>
|
||||
<script src="../../support/subpixel-utils.js"></script>
|
||||
<script>
|
||||
genLeftRoundedRectFloatShapeOutsideRefTest({
|
||||
roundedRect: {x: 0, y: 20, width: 160, height: 160, rx: 80, ry: 80},
|
||||
containerWidth: 200,
|
||||
containerHeight: 200,
|
||||
lineHeight: 20,
|
||||
floatElementClassSuffix: "circle-float-line",
|
||||
insertElementIdSuffix: "circle-outline"
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
#container {
|
||||
position: relative;
|
||||
}
|
||||
#line {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 168px;
|
||||
width: 2px;
|
||||
height: 200px;
|
||||
border-left: 2px solid blue;
|
||||
}
|
||||
#square {
|
||||
position: absolute;
|
||||
top: 80px;
|
||||
left: 170px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background-color: green;
|
||||
}
|
||||
</style></head>
|
||||
|
||||
<body>
|
||||
<p>The test passes if there is a green square to the right of the blue line. There should be no red.</p>
|
||||
<div id="container">
|
||||
<div id="line"></div>
|
||||
<div id="square"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
#container {
|
||||
position: relative;
|
||||
}
|
||||
#line {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 140px;
|
||||
width: 2px;
|
||||
height: 200px;
|
||||
border-left: 2px solid blue;
|
||||
}
|
||||
#square {
|
||||
position: absolute;
|
||||
top: 80px;
|
||||
left: 100px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background-color: green;
|
||||
}
|
||||
</style></head>
|
||||
|
||||
<body>
|
||||
<p>The test passes if there is a green square to the left of the blue line. There should be no red.</p>
|
||||
<div id="container">
|
||||
<div id="line"></div>
|
||||
<div id="square"></div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,65 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
.container {
|
||||
position: relative;
|
||||
font: 15px Ahem, sans-serif;
|
||||
line-height: 20px;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
color: green;
|
||||
}
|
||||
.ellipse {
|
||||
z-index: -1;
|
||||
width: 160px;
|
||||
height: 80px;
|
||||
border-radius: 80px;
|
||||
background-color: blue;
|
||||
overflow: hidden;
|
||||
}
|
||||
#left-ellipse-outline {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 0px;
|
||||
}
|
||||
.left-ellipse-float-line {
|
||||
float: left;
|
||||
clear: left;
|
||||
height: 20px;
|
||||
}
|
||||
</style></head>
|
||||
|
||||
<body>
|
||||
<p>The test passes if all of the squares are green. There should be no red.</p>
|
||||
<div class="container">
|
||||
X<br />
|
||||
<div id="left-ellipse-outline"></div>
|
||||
<!-- generated left-rounded-rect-float-line divs will be inserted here -->
|
||||
X<br />
|
||||
X<br />
|
||||
X<br />
|
||||
X<br />
|
||||
X
|
||||
</div>
|
||||
|
||||
<script src="../../support/rounded-rectangle.js"></script>
|
||||
<script src="../../support/subpixel-utils.js"></script>
|
||||
<script>
|
||||
genLeftRoundedRectFloatShapeOutsideRefTest({
|
||||
roundedRect: {x: 0, y: 20, width: 160, height: 80, rx: 80, ry: 40},
|
||||
containerWidth: 200,
|
||||
containerHeight: 200,
|
||||
lineHeight: 20,
|
||||
floatElementClassSuffix: "ellipse-float-line",
|
||||
insertElementIdSuffix: "ellipse-outline"
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style>
|
||||
#shape {
|
||||
margin-left: 25px;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background-color: green;
|
||||
}
|
||||
</style></head>
|
||||
|
||||
<body>
|
||||
<p>The test passes if there is a green square and no red.</p>
|
||||
<div id="shape"></div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="betravis@adobe.com" rel="author" title="Bear Travis" />
|
||||
<style type="text/css">
|
||||
.container {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background-color: red;
|
||||
font-family: Ahem;
|
||||
font-size: 50px;
|
||||
line-height: 1;
|
||||
}
|
||||
#test {
|
||||
color: green;
|
||||
}
|
||||
#gradient {
|
||||
float: left;
|
||||
width: 100px;
|
||||
height: 200px;
|
||||
background-color: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if you see a green square. There should be no red.
|
||||
</p>
|
||||
<div class="container" id="test">
|
||||
<div id="gradient"></div>
|
||||
xx xx xx xx
|
||||
</div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="betravis@adobe.com" rel="author" title="Bear Travis" />
|
||||
<style type="text/css">
|
||||
.container {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background-color: red;
|
||||
font-family: Ahem;
|
||||
font-size: 50px;
|
||||
line-height: 1;
|
||||
}
|
||||
#test {
|
||||
color: green;
|
||||
}
|
||||
#gradient {
|
||||
float: right;
|
||||
width: 100px;
|
||||
height: 200px;
|
||||
background-color: green;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if you see a green square. There should be no red.
|
||||
</p>
|
||||
<div class="container" id="test">
|
||||
<div id="gradient"></div>
|
||||
xx xx xx xx
|
||||
</div>
|
||||
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:stearns@adobe.com" rel="author" title="Alan Stearns" />
|
||||
<style type="text/css">
|
||||
.square {
|
||||
display: inline-block;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
line-height: 100px;
|
||||
background-color: green;
|
||||
}
|
||||
#test {
|
||||
position: absolute;
|
||||
top: 70px;
|
||||
width: 200px;
|
||||
font-size: 0px;
|
||||
}
|
||||
#test > .right {
|
||||
margin-left: 100px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
The test passes if there are four green squares alternating left and right. There
|
||||
should be no red.
|
||||
</p>
|
||||
<div id="test">
|
||||
<div class="square"></div><br />
|
||||
<div class="square right"></div><br />
|
||||
<div class="square"></div><br />
|
||||
<div class="square right"></div>
|
||||
</div>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
#green-square {
|
||||
position: absolute;
|
||||
top: 50px;
|
||||
left: 10px;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background-color: green;
|
||||
}
|
||||
</style></head>
|
||||
|
||||
<body>
|
||||
<p>The test passes if there is green square and no red.</p>
|
||||
<div id="green-square"></div>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
#green-square {
|
||||
position: absolute;
|
||||
top: 50px;
|
||||
left: 10px;
|
||||
width: 240px;
|
||||
height: 240px;
|
||||
background-color: green;
|
||||
}
|
||||
</style></head>
|
||||
|
||||
<body>
|
||||
<p>The test passes if there is green square and no red.</p>
|
||||
<div id="green-square"></div>
|
||||
|
||||
</body></html>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml"><head>
|
||||
<title>CSS Reference File</title>
|
||||
<link href="mailto:rhauck@adobe.com" rel="author" title="Rebecca Hauck" />
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
.line {
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
width: 2px;
|
||||
height: 200px;
|
||||
border-left: 2px solid blue;
|
||||
}
|
||||
.right {
|
||||
left: 220px;
|
||||
}
|
||||
.left {
|
||||
left: 60px;
|
||||
}
|
||||
.top {
|
||||
top: 90px;
|
||||
left: 180px;
|
||||
}
|
||||
.bottom {
|
||||
top: 170px;
|
||||
left: 60px;
|
||||
}
|
||||
.square {
|
||||
position: absolute;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background-color: green;
|
||||
}
|
||||
</style></head>
|
||||
|
||||
<body>
|
||||
<p>The test passes if there there are two green squares between the blue lines. There should be no red.</p>
|
||||
<div class="bottom square"></div>
|
||||
<div class="top square"></div>
|
||||
<div class="left line"></div>
|
||||
<div class="right line"></div>
|
||||
|
||||
</body></html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 135 B |
Binary file not shown.
|
After Width: | Height: | Size: 135 B |
Binary file not shown.
|
After Width: | Height: | Size: 109 B |
Binary file not shown.
|
After Width: | Height: | Size: 109 B |
Binary file not shown.
|
After Width: | Height: | Size: 135 B |
Binary file not shown.
|
After Width: | Height: | Size: 109 B |
Binary file not shown.
|
After Width: | Height: | Size: 224 B |
Binary file not shown.
|
After Width: | Height: | Size: 218 B |
Binary file not shown.
|
After Width: | Height: | Size: 217 B |
|
|
@ -0,0 +1,29 @@
|
|||
CSS Global Support Directory
|
||||
============================
|
||||
|
||||
This directory contains common support files (such as images and external
|
||||
style sheets). These are sync'ed into the support directories of all our
|
||||
test suites. If you have test-suite-specific support files, please add
|
||||
them to the appropriate test-suite-specific support/ directory.
|
||||
|
||||
If you add to a support/ directory, please run the tools/supportprop.py
|
||||
script from the top of the repository to cascade support files into the
|
||||
lower-level support directories.
|
||||
|
||||
Description of the Common Support File Collection
|
||||
-------------------------------------------------
|
||||
|
||||
The 1x1-* images are all exactly one pixel.
|
||||
|
||||
The swatch-* images all use 15x15 cells.
|
||||
|
||||
The square-* images all use 15x15 cells with one pixel borders.
|
||||
|
||||
The pattern-* images use cells of various sizes:
|
||||
|
||||
pattern-gg-gr.png 20x20
|
||||
pattern-grg-rgr-grg.png 20x20
|
||||
pattern-rgr-grg-rgr.png 20x20
|
||||
pattern-tr.png 15x15
|
||||
pattern-grg-rrg-rgg.png 15x15
|
||||
|
||||
|
|
@ -0,0 +1 @@
|
|||
.a { color: green; }
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
|
|
@ -0,0 +1 @@
|
|||
.b { color: green; }
|
||||
|
|
@ -0,0 +1 @@
|
|||
.c { color: red; }
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.9 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="100px" height="100px" style="background-color: rgba(0,0,0,0.2)" version="1.1">
|
||||
<path fill="#006400" d=" M 0.00 0.00 L 50.00 0.00 C 50.00 33.33 50.00 66.67 50.00 100.00 L 0.00 100.00 L 0.00 0.00 Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 252 B |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="100px" height="100px" style="background-color: rgba(0,0,0,0.5)" version="1.1">
|
||||
<path fill="#006400" d=" M 0.00 0.00 L 50.00 0.00 C 50.00 33.33 50.00 66.67 50.00 100.00 L 0.00 100.00 L 0.00 0.00 Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 252 B |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="100px" height="100px" style="background-color: rgba(0,0,0,0.7)" version="1.1">
|
||||
<path fill="#006400" d=" M 0.00 0.00 L 50.00 0.00 C 50.00 33.33 50.00 66.67 50.00 100.00 L 0.00 100.00 L 0.00 0.00 Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 252 B |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="100px" height="100px" version="1.1">
|
||||
<path fill="#006400" d=" M 0.00 0.00 L 50.00 0.00 C 50.00 33.33 50.00 66.67 50.00 100.00 L 0.00 100.00 L 0.00 0.00 Z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 210 B |
|
|
@ -0,0 +1,866 @@
|
|||
var ParsingUtils = (function() {
|
||||
function testInlineStyle(value, expected) {
|
||||
var div = document.createElement('div');
|
||||
div.style.setProperty('shape-outside', value);
|
||||
var actual = div.style.getPropertyValue('shape-outside');
|
||||
assert_equals(actual, expected);
|
||||
}
|
||||
|
||||
function testComputedStyle(value, expected) {
|
||||
var div = document.createElement('div');
|
||||
div.style.setProperty('shape-outside', value);
|
||||
document.body.appendChild(div);
|
||||
var style = getComputedStyle(div);
|
||||
var actual = style.getPropertyValue('shape-outside');
|
||||
actual = roundResultStr(actual);
|
||||
document.body.removeChild(div);
|
||||
|
||||
// Some of the tests in this suite have either/or expected results
|
||||
// so this check allows for testing that at least one of them passes.
|
||||
// Description of the 2 expecteds is below near calcTestValues.
|
||||
if(Object.prototype.toString.call( expected ) === '[object Array]' && expected.length == 2) {
|
||||
assert_true(expected[0] == actual || expected[1] == actual)
|
||||
} else {
|
||||
assert_equals(actual, typeof expected !== 'undefined' ? expected : value);
|
||||
}
|
||||
}
|
||||
|
||||
function testShapeMarginInlineStyle(value, expected) {
|
||||
var div = document.createElement('div');
|
||||
div.style.setProperty('shape-outside', "border-box inset(10px)");
|
||||
div.style.setProperty('shape-margin', value);
|
||||
var actual = div.style.getPropertyValue('shape-margin');
|
||||
assert_equals(actual, expected);
|
||||
}
|
||||
|
||||
function testShapeMarginComputedStyle(value, expected) {
|
||||
|
||||
var outerDiv = document.createElement('div');
|
||||
outerDiv.style.setProperty('width', '100px');
|
||||
|
||||
var innerDiv = document.createElement('div');
|
||||
innerDiv.style.setProperty('shape-outside', "border-box inset(10px)");
|
||||
innerDiv.style.setProperty('shape-margin', value);
|
||||
|
||||
outerDiv.appendChild(innerDiv);
|
||||
document.body.appendChild(outerDiv);
|
||||
|
||||
var style = getComputedStyle(innerDiv);
|
||||
var actual = style.getPropertyValue('shape-margin');
|
||||
|
||||
assert_not_equals(actual, null);
|
||||
if(actual.indexOf('calc') == -1 )
|
||||
actual = roundResultStr(actual);
|
||||
document.body.removeChild(outerDiv);
|
||||
|
||||
// See comment above about multiple expected results
|
||||
if(Object.prototype.toString.call( expected ) === '[object Array]' && expected.length == 2) {
|
||||
assert_true(expected[0] == actual || expected[1] == actual)
|
||||
} else {
|
||||
assert_equals(actual, !expected ? '0px' : expected);
|
||||
}
|
||||
}
|
||||
|
||||
function testShapeThresholdInlineStyle(value, expected) {
|
||||
var div = document.createElement('div');
|
||||
div.style.setProperty('shape-outside', 'url(someimage.png)');
|
||||
div.style.setProperty('shape-image-threshold', value);
|
||||
var actual = div.style.getPropertyValue('shape-image-threshold');
|
||||
assert_equals(actual, expected);
|
||||
}
|
||||
|
||||
function testShapeThresholdComputedStyle(value, expected) {
|
||||
|
||||
var div = document.createElement('div');
|
||||
div.style.setProperty('shape-outside', 'url(someimage.png)');
|
||||
div.style.setProperty('shape-image-threshold', value);
|
||||
document.body.appendChild(div);
|
||||
|
||||
var style = getComputedStyle(div);
|
||||
var actual = style.getPropertyValue('shape-image-threshold');
|
||||
|
||||
assert_not_equals(actual, null);
|
||||
if(actual.indexOf('calc') == -1 )
|
||||
actual = roundResultStr(actual);
|
||||
document.body.removeChild(div);
|
||||
|
||||
// See comment above about multiple expected results
|
||||
if(Object.prototype.toString.call( expected ) === '[object Array]' && expected.length == 2) {
|
||||
assert_true(expected[0] == actual || expected[1] == actual)
|
||||
} else {
|
||||
assert_equals(actual, !expected ? '0' : expected);
|
||||
}
|
||||
}
|
||||
|
||||
// Builds an array of test cases to send to testharness.js where one test case is: [name, actual, expected]
|
||||
// These test cases will verify results from testInlineStyle() or testComputedStyle()
|
||||
function buildTestCases(testCases, testType) {
|
||||
var results = [];
|
||||
|
||||
// If test_type isn't specified, test inline style
|
||||
var type = typeof testType == 'undefined' ? 'invalid': testType;
|
||||
|
||||
testCases.forEach(function(test) {
|
||||
oneTestCase = [];
|
||||
|
||||
// name - annotated by type (inline vs. computed)
|
||||
if ( test.hasOwnProperty('name') ) {
|
||||
oneTestCase.push(test['name'] +' - '+ type);
|
||||
} else {
|
||||
// If test_name isn't specified, use the actual
|
||||
oneTestCase.push(test['actual'] +' - '+ type);
|
||||
}
|
||||
|
||||
// actual
|
||||
oneTestCase.push(test['actual'])
|
||||
|
||||
// expected
|
||||
if( type.indexOf('invalid') != -1 ){
|
||||
oneTestCase.push(null)
|
||||
} else if( type == 'inline' ) {
|
||||
oneTestCase.push(test['expected_inline']);
|
||||
} else if( type == 'computed' ){
|
||||
oneTestCase.push( convertToPx(test['expected_computed']) );
|
||||
}
|
||||
results.push(oneTestCase);
|
||||
});
|
||||
return results;
|
||||
}
|
||||
|
||||
|
||||
function buildPositionTests(shape, valid, type, units) {
|
||||
var results = new Array();
|
||||
var convert = type.indexOf('computed') != -1 ? true : false;
|
||||
|
||||
if(Object.prototype.toString.call( units ) === '[object Array]') {
|
||||
units.forEach(function(unit) {
|
||||
positionTests = buildPositionTests(shape, valid, type, unit);
|
||||
results = results.concat(positionTests);
|
||||
});
|
||||
} else {
|
||||
if (valid) {
|
||||
validPositions.forEach(function(test) {
|
||||
var testCase = [], testName, actual, expected;
|
||||
// skip if this isn't explicitly testing length units
|
||||
if( !(type.indexOf('lengthUnit') != -1 && test[0].indexOf("u1") == -1)) {
|
||||
// actual
|
||||
actual = shape + '(at ' + setUnit(test[0], false, units) +')';
|
||||
|
||||
// expected
|
||||
// if(convert && shape == 'circle')
|
||||
// expected = shape + '(at ' + setUnit(test[1], convert, units) +')';
|
||||
// else if(convert && shape == 'ellipse')
|
||||
// expected = shape + '(at ' + setUnit(test[1], convert, units) +')';
|
||||
// else
|
||||
expected = shape + '(at ' + setUnit(test[1], convert, units) +')';
|
||||
|
||||
// name
|
||||
if (type == 'lengthUnit + inline')
|
||||
testName = 'test unit (inline): ' + units +' - '+ actual;
|
||||
else if (type == 'lengthUnit + computed')
|
||||
testName = 'test unit (computed): ' + units +' - '+ actual;
|
||||
else
|
||||
testName = (actual + ' serializes as ' + expected +' - '+ type);
|
||||
|
||||
testCase.push(testName)
|
||||
testCase.push(actual);
|
||||
testCase.push(expected);
|
||||
results.push(testCase);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
invalidPositions.forEach(function(test) {
|
||||
var testValue = shape + '(at ' + setUnit(test, false, units) +')';
|
||||
testCase = new Array();
|
||||
testCase.push(testValue + ' is invalid');
|
||||
testCase.push(testValue);
|
||||
testCase.push(null);
|
||||
results.push(testCase);
|
||||
});
|
||||
}
|
||||
}
|
||||
return unique(results);
|
||||
}
|
||||
|
||||
function buildRadiiTests(shape, type, units) {
|
||||
var results = new Array();
|
||||
var testUnits = typeof units == 'undefined' ? 'px': units;
|
||||
var convert = type.indexOf('computed') != -1 ? true : false;
|
||||
|
||||
if(Object.prototype.toString.call( testUnits ) === '[object Array]') {
|
||||
testUnits.forEach(function(unit) {
|
||||
radiiTests = buildRadiiTests(shape, type, unit);
|
||||
results = results.concat(radiiTests);
|
||||
});
|
||||
} else {
|
||||
var validRadii = shape == 'circle' ? validCircleRadii : validEllipseRadii;
|
||||
validRadii.forEach(function(test) {
|
||||
var testCase = [], name, actual, expected;
|
||||
|
||||
// skip if this isn't explicitly testing length units
|
||||
if( !(type.indexOf('lengthUnit') != -1 && test[0].indexOf("u1") == -1) ) {
|
||||
actual = shape + '(' + setUnit(test[0], false, testUnits) +')';
|
||||
// name
|
||||
if (type.indexOf('lengthUnit') != -1) {
|
||||
name = 'test unit: ' + units +' - '+ actual;
|
||||
if(type.indexOf('computed') != -1)
|
||||
name = name + ' - computed';
|
||||
else
|
||||
name = name + ' - inline';
|
||||
}
|
||||
else
|
||||
name = actual +' - '+ type;
|
||||
|
||||
testCase.push(name);
|
||||
|
||||
// actual
|
||||
testCase.push(actual);
|
||||
|
||||
// expected
|
||||
if(type.indexOf('computed') != -1 && test.length == 3) {
|
||||
expected = shape + '(' + setUnit(test[2], convert, testUnits) +')';
|
||||
} else {
|
||||
expected = shape + '(' + setUnit(test[1], convert, testUnits) +')';
|
||||
}
|
||||
testCase.push(expected);
|
||||
results.push(testCase);
|
||||
}
|
||||
});
|
||||
}
|
||||
return unique(results);
|
||||
}
|
||||
|
||||
function buildInsetTests(unit1, unit2, type) {
|
||||
var results = new Array();
|
||||
var convert = type == 'computed' ? true : false;
|
||||
|
||||
if(Object.prototype.toString.call( unit1 ) === '[object Array]') {
|
||||
unit1.forEach(function(unit) {
|
||||
insetTests = buildInsetTests(unit, unit2, type);
|
||||
results = results.concat(insetTests);
|
||||
});
|
||||
} else {
|
||||
validInsets.forEach(function(test) {
|
||||
var testCase = [], name, actual, expected;
|
||||
|
||||
name = setUnit(test[0], false, unit1, unit2) +' - '+ type;
|
||||
actual = 'inset(' + setUnit(test[1], convert, unit1, unit2) +')';
|
||||
expected = actual;
|
||||
|
||||
testCase.push(name);
|
||||
testCase.push(actual);
|
||||
testCase.push(expected);
|
||||
|
||||
results.push(testCase);
|
||||
});
|
||||
}
|
||||
return unique(results);
|
||||
}
|
||||
|
||||
function buildPolygonTests(unitSet, type) {
|
||||
var results = new Array();
|
||||
var convert = type == 'computed' ? true : false;
|
||||
|
||||
unitSet.forEach(function(set) {
|
||||
validPolygons.forEach(function(test) {
|
||||
var testCase = [];
|
||||
// name
|
||||
testCase.push(setUnit(test[0], false, set[0], set[1], set[2]) +' - '+ type);
|
||||
// actual
|
||||
testCase.push('polygon(' + setUnit(test[1], false, set[0], set[1], set[2]) +')');
|
||||
// expected
|
||||
testCase.push('polygon(' + setUnit(test[1], convert, set[0], set[1], set[2]) +')');
|
||||
results.push(testCase);
|
||||
});
|
||||
});
|
||||
return unique(results);
|
||||
}
|
||||
|
||||
function buildCalcTests(testCases, type) {
|
||||
var results = new Array();
|
||||
testCases.forEach(function(test){
|
||||
var testCase = [];
|
||||
if(type == 'computed') {
|
||||
testCase.push(test[0] + ' - computed style');
|
||||
testCase.push(test[0]);
|
||||
testCase.push(test[2]);
|
||||
}
|
||||
else {
|
||||
testCase.push(test[0] + ' - inline style');
|
||||
testCase.push(test[0]);
|
||||
testCase.push(test[1]);
|
||||
}
|
||||
testCase.push(type);
|
||||
results.push(testCase)
|
||||
});
|
||||
return unique(results);
|
||||
}
|
||||
|
||||
function unique(tests) {
|
||||
var list = tests.concat();
|
||||
for(var i = 0; i< list.length; ++i) {
|
||||
for(var j = i+1; j < list.length; ++j) {
|
||||
if(list[i][0] === list[j][0])
|
||||
list.splice(j--, 1);
|
||||
}
|
||||
}
|
||||
return list;
|
||||
}
|
||||
|
||||
function setUnit(str, convert, unit1, unit2, unit3) {
|
||||
var retStr = str;
|
||||
if(typeof unit1 !== 'undefined') {
|
||||
retStr = retStr.replace(new RegExp('u1', 'g'), unit1);
|
||||
}
|
||||
if(typeof unit2 !== 'undefined') {
|
||||
retStr = retStr.replace(new RegExp("u2", 'g'), unit2);
|
||||
}
|
||||
if(typeof unit3 !== 'undefined') {
|
||||
retStr = retStr.replace(new RegExp("u3", 'g'), unit3);
|
||||
}
|
||||
retStr = convert ? convertToPx(retStr) : retStr;
|
||||
return retStr;
|
||||
}
|
||||
|
||||
function convertToPx(origValue) {
|
||||
|
||||
var valuesToConvert = origValue.match(/[0-9]+(\.[0-9]+)?([a-z]{2,4}|%)/g);
|
||||
if(!valuesToConvert)
|
||||
return origValue;
|
||||
|
||||
var retStr = origValue;
|
||||
for(var i = 0; i < valuesToConvert.length; i++) {
|
||||
var unit = valuesToConvert[i].match(/[a-z]{2,4}|%/).toString();
|
||||
var numberStr = valuesToConvert[i].match(/[0-9]+(\.[0-9]+)?/)[0];
|
||||
|
||||
var number = parseFloat(numberStr);
|
||||
var convertedUnit = 'px';
|
||||
if( typeof number !== 'NaN' )
|
||||
{
|
||||
if (unit == 'in') {
|
||||
number = (96 * number);
|
||||
} else if (unit == 'cm') {
|
||||
number = (37.795275591 * number);
|
||||
} else if (unit == 'mm') {
|
||||
number = (3.779527559 * number);
|
||||
} else if (unit == 'pt') {
|
||||
number = (1.333333333333 * number);
|
||||
} else if (unit == 'pc') {
|
||||
number = (16 * number);
|
||||
} else if (unit == 'em') {
|
||||
number = (16 * number);
|
||||
} else if (unit == 'ex') {
|
||||
number = (7.1796875 * number);
|
||||
} else if (unit == 'ch') {
|
||||
number = (8 * number);
|
||||
} else if (unit == 'rem') {
|
||||
number = (16 * number);
|
||||
} else if (unit == 'vw') {
|
||||
number = ((.01 * window.innerWidth) * number);
|
||||
} else if (unit == 'vh') {
|
||||
number = ((.01 * window.innerHeight) * number);
|
||||
} else if (unit == 'vmin') {
|
||||
number = Math.min( (.01 * window.innerWidth), (.01 * window.innerHeight) ) * number;
|
||||
} else if (unit == 'vmax') {
|
||||
number = Math.max( (.01 * window.innerWidth), (.01 * window.innerHeight) ) * number;
|
||||
}
|
||||
else {
|
||||
convertedUnit = unit;
|
||||
}
|
||||
number = Math.round(number * 1000) / 1000;
|
||||
var find = valuesToConvert[i];
|
||||
var replace = number.toString() + convertedUnit;
|
||||
retStr = retStr.replace(valuesToConvert[i], number.toString() + convertedUnit);
|
||||
}
|
||||
}
|
||||
return retStr.replace(',,', ',');
|
||||
}
|
||||
|
||||
function roundResultStr(str) {
|
||||
if(Object.prototype.toString.call( str ) !== '[object String]')
|
||||
return str;
|
||||
|
||||
var numbersToRound = str.match(/[0-9]+\.[0-9]+/g);
|
||||
if(!numbersToRound)
|
||||
return str;
|
||||
|
||||
var retStr = str;
|
||||
for(var i = 0; i < numbersToRound.length; i++) {
|
||||
num = parseFloat(numbersToRound[i]);
|
||||
if( !isNaN(num) ) {
|
||||
roundedNum = Math.round(num*1000)/1000;
|
||||
retStr = retStr.replace(numbersToRound[i].toString(), roundedNum.toString());
|
||||
}
|
||||
}
|
||||
|
||||
return retStr;
|
||||
}
|
||||
|
||||
function generateInsetRoundCases(units, testType) {
|
||||
var convert = testType.indexOf('computed') != -1 ? true : false;
|
||||
var testUnit = units;
|
||||
var sizes = [
|
||||
'10' + units,
|
||||
'20' + units,
|
||||
'30' + units,
|
||||
'40' + units
|
||||
];
|
||||
|
||||
function insetRound(value) {
|
||||
return 'inset(10' +testUnit+ ' round ' + value + ')';
|
||||
}
|
||||
|
||||
function serializedInsetRound(lhsValues, rhsValues, convert) {
|
||||
var retStr = '';
|
||||
if(!rhsValues)
|
||||
retStr = 'inset(10' +testUnit+ ' round ' + lhsValues +')';
|
||||
else
|
||||
retStr = 'inset(10' +testUnit+ ' round ' + lhsValues +' / '+ rhsValues +')';
|
||||
|
||||
if(convert)
|
||||
return convertToPx(retStr);
|
||||
|
||||
return retStr;
|
||||
}
|
||||
|
||||
var results = [], left, lhs, right, rhs;
|
||||
for (left = 1; left <= 4; left++) {
|
||||
lhs = sizes.slice(0, left).join(' ');
|
||||
results.push([insetRound(lhs) +' - '+ testType, insetRound(lhs), serializedInsetRound(lhs, null, convert)]);
|
||||
for (right = 1; right <= 4; right++) {
|
||||
rhs = sizes.slice(0, right).join(' ');
|
||||
if(lhs == rhs)
|
||||
results.push([insetRound(lhs + ' / ' + rhs) +' - '+ testType, insetRound(lhs + ' / ' + rhs), serializedInsetRound(lhs, null, convert)]);
|
||||
else
|
||||
results.push([insetRound(lhs + ' / ' + rhs) +' - '+ testType, insetRound(lhs + ' / ' + rhs), serializedInsetRound(lhs, rhs, convert)]);
|
||||
}
|
||||
}
|
||||
return results;
|
||||
}
|
||||
|
||||
var validUnits = [
|
||||
"cm","mm","in","pt","pc", // Absolute length units (omitting px b/c we default to that in all tests)
|
||||
"em","ex","ch","rem", // Font relative length units
|
||||
"vw","vh","vmin","vmax" // Viewport percentage units
|
||||
]
|
||||
|
||||
/// [actual, expected]
|
||||
var validPositions = [
|
||||
|
||||
/// [ percent ], [ length ], [ percent | percent ], [ percent | length ], [ length | percent ], [ length | length ]
|
||||
["50%", "50% 50%"],
|
||||
["50u1", "50u1 50%"],
|
||||
["50% 50%", "50% 50%"],
|
||||
["50% 50u1", "50% 50u1"],
|
||||
["50u1 50%", "50u1 50%"],
|
||||
["50u1 50u1", "50u1 50u1"],
|
||||
|
||||
///// [ keyword ], [ keyword keyword ] x 5 keywords
|
||||
["left", "0% 50%"],
|
||||
["top", "50% 0%"],
|
||||
["right", "100% 50%"],
|
||||
["bottom", "50% 100%"],
|
||||
["center", "50% 50%"],
|
||||
|
||||
["left top", "0% 0%"],
|
||||
["left bottom", "0% 100%"],
|
||||
["left center", "0% 50%"],
|
||||
|
||||
["top left", "0% 0%"],
|
||||
["top right", "100% 0%"],
|
||||
["top center", "50% 0%"],
|
||||
|
||||
["right top", "100% 0%"],
|
||||
["right bottom", "100% 100%"],
|
||||
["right center", "100% 50%"],
|
||||
|
||||
["bottom left", "0% 100%"],
|
||||
["bottom right", "100% 100%"],
|
||||
["bottom center", "50% 100%"],
|
||||
|
||||
["center top", "50% 0%"],
|
||||
["center left", "0% 50%"],
|
||||
["center right", "100% 50%"],
|
||||
["center bottom", "50% 100%"],
|
||||
["center center", "50% 50%"],
|
||||
|
||||
////// [ keyword | percent ], [ keyword | length ], [ percent | keyword ], [ length | keyword ] x 5 keywords
|
||||
["left 50%", "0% 50%"],
|
||||
["left 50u1", "0% 50u1"],
|
||||
|
||||
["50% top", "50% 0%"],
|
||||
["50u1 top", "50u1 0%"],
|
||||
|
||||
["right 80%", "100% 80%"],
|
||||
["right 80u1", "100% 80u1"],
|
||||
|
||||
["70% bottom", "70% 100%"],
|
||||
["70u1 bottom", "70u1 100%"],
|
||||
|
||||
["center 60%", "50% 60%"],
|
||||
["center 60u1", "50% 60u1"],
|
||||
["60% center", "60% 50%"],
|
||||
["60u1 center", "60u1 50%"],
|
||||
|
||||
////// [ keyword | keyword percent ], [ keyword | keyword length ] x 5 keywords
|
||||
["center top 50%", "50% 50%"],
|
||||
["center top 50u1", "50% 50u1"],
|
||||
["center left 50%", "50% 50%"],
|
||||
["center left 50u1", "50u1 50%"],
|
||||
["center right 70%", "30% 50%"],
|
||||
["center right 70u1", "right 70u1 top 50%"],
|
||||
["center bottom 70%", "50% 30%"],
|
||||
["center bottom 70u1", "left 50% bottom 70u1"],
|
||||
|
||||
["left top 50%", "0% 50%"],
|
||||
["left top 50u1", "0% 50u1"],
|
||||
["left bottom 70%", "0% 30%"],
|
||||
["left bottom 70u1", "left 0% bottom 70u1"],
|
||||
|
||||
["top left 50%", "50% 0%"],
|
||||
["top left 50u1", "50u1 0%"],
|
||||
["top right 70%", "30% 0%"],
|
||||
["top right 70u1", "right 70u1 top 0%"],
|
||||
|
||||
["bottom left 50%", "50% 100%"],
|
||||
["bottom left 50u1", "50u1 100%"],
|
||||
["bottom right 70%", "30% 100%"],
|
||||
["bottom right 70u1", "right 70u1 top 100%"],
|
||||
|
||||
["right bottom 70%", "100% 30%"],
|
||||
["right bottom 70u1", "left 100% bottom 70u1"],
|
||||
["right top 50%", "100% 50%"],
|
||||
["right top 50u1", "100% 50u1"],
|
||||
|
||||
////// [ keyword percent | keyword], [ keyword length | keyword ] x 5 keywords
|
||||
["left 50% center", "50% 50%"],
|
||||
["left 50u1 center", "50u1 50%"],
|
||||
["left 50% top", "50% 0%"],
|
||||
["left 50u1 top", "50u1 0%"],
|
||||
["left 50% bottom", "50% 100%"],
|
||||
["left 50u1 bottom", "50u1 100%"],
|
||||
|
||||
["top 50% center", "50% 50%"],
|
||||
["top 50u1 center", "50% 50u1"],
|
||||
["top 50% left", "0% 50%"],
|
||||
["top 50u1 left", "0% 50u1"],
|
||||
["top 50% right", "100% 50%"],
|
||||
["top 50u1 right", "100% 50u1"],
|
||||
|
||||
["bottom 70% center", "50% 30%"],
|
||||
["bottom 70u1 center", "left 50% bottom 70u1"],
|
||||
["bottom 70% left", "0% 30%"],
|
||||
["bottom 70u1 left", "left 0% bottom 70u1"],
|
||||
["bottom 70% right", "100% 30%"],
|
||||
["bottom 70u1 right", "left 100% bottom 70u1"],
|
||||
|
||||
["right 80% center", "20% 50%"],
|
||||
["right 80u1 center", "right 80u1 top 50%"],
|
||||
["right 80% bottom", "20% 100%"],
|
||||
["right 80u1 bottom", "right 80u1 top 100%"],
|
||||
["right 80% top", "20% 0%"],
|
||||
["right 80u1 top", "right 80u1 top 0%"],
|
||||
|
||||
////// [ keyword percent | keyword percent], [ keyword percent | keyword length],
|
||||
////// [ keyword length | keyword length], [ keyword length | keyword percent] x 5 keywords
|
||||
["left 50% top 50%", "50% 50%"],
|
||||
["left 50% top 50u1", "50% 50u1"],
|
||||
["left 50% bottom 70%", "50% 30%"],
|
||||
["left 50% bottom 70u1", "left 50% bottom 70u1"],
|
||||
["left 50u1 top 50%", "50u1 50%"],
|
||||
["left 50u1 top 50u1", "50u1 50u1"],
|
||||
["left 50u1 bottom 70%", "50u1 30%"],
|
||||
["left 50u1 bottom 70u1", "left 50u1 bottom 70u1"],
|
||||
|
||||
["top 50% left 50%", "50% 50%"],
|
||||
["top 50% left 50u1", "50u1 50%"],
|
||||
["top 50% right 80%", "20% 50%"],
|
||||
["top 50% right 80u1", "right 80u1 top 50%"],
|
||||
["top 50u1 left 50%", "50% 50u1"],
|
||||
["top 50u1 left 50u1", "50u1 50u1"],
|
||||
["top 50u1 right 80%", "20% 50u1"],
|
||||
["top 50u1 right 80u1", "right 80u1 top 50u1"],
|
||||
|
||||
["bottom 70% left 50%", "50% 30%"],
|
||||
["bottom 70% left 50u1", "50u1 30%"],
|
||||
["bottom 70% right 80%", "20% 30%"],
|
||||
["bottom 70% right 80u1", "right 80u1 top 30%"],
|
||||
["bottom 70u1 left 50%", "left 50% bottom 70u1"],
|
||||
["bottom 70u1 left 50u1", "left 50u1 bottom 70u1"],
|
||||
["bottom 70u1 right 80%", "left 20% bottom 70u1"],
|
||||
["bottom 70u1 right 80u1", "right 80u1 bottom 70u1"],
|
||||
|
||||
["right 80% top 50%", "20% 50%"],
|
||||
["right 80% top 50u1", "20% 50u1"],
|
||||
["right 80% bottom 70%", "20% 30%"],
|
||||
["right 80% bottom 70u1", "left 20% bottom 70u1"],
|
||||
["right 80u1 top 50%", "right 80u1 top 50%"],
|
||||
["right 80u1 top 50u1", "right 80u1 top 50u1"],
|
||||
["right 80u1 bottom 70%", "right 80u1 top 30%"],
|
||||
["right 80u1 bottom 70u1", "right 80u1 bottom 70u1"],
|
||||
];
|
||||
|
||||
var invalidPositions = [
|
||||
////// [ keyword | percent ], [ keyword | length ], [ percent | keyword ], [ length | keyword ] x 5 keywords
|
||||
"50% left",
|
||||
"50px left",
|
||||
"top 50%",
|
||||
"80% right",
|
||||
"80px right",
|
||||
"bottom 70%",
|
||||
"bottom 70px",
|
||||
|
||||
////// [ keyword | keyword percent ], [ keyword | keyword length ] x 5 keywords
|
||||
"center center 60%",
|
||||
"center center 60px",
|
||||
|
||||
"left center 60%",
|
||||
"left center 60px",
|
||||
"left right 80%",
|
||||
"left right 80px",
|
||||
"left left 50%",
|
||||
"left left 50px",
|
||||
|
||||
"top center 60%",
|
||||
"top center 60px",
|
||||
"top bottom 80%",
|
||||
"top bottom 80px",
|
||||
"top top 50%",
|
||||
"top top 50px",
|
||||
|
||||
"bottom center 60%",
|
||||
"bottom center 60px",
|
||||
"bottom top 50%",
|
||||
"bottom top 50px",
|
||||
"bottom bottom 50%",
|
||||
"bottom bottom 50px",
|
||||
|
||||
"right center 60%",
|
||||
"right center 60px",
|
||||
"right left 50%",
|
||||
"right left 50px",
|
||||
"right right 70%",
|
||||
"right right 70px",
|
||||
|
||||
////// [ keyword percent | keyword], [ keyword length | keyword ] x 5 keywords
|
||||
"center 60% top",
|
||||
"center 60px top",
|
||||
"center 60% bottom",
|
||||
"center 60px bottom",
|
||||
"center 60% left",
|
||||
"center 60px left",
|
||||
"center 60% right",
|
||||
"center 60px right",
|
||||
"center 60% center",
|
||||
"center 60px center",
|
||||
|
||||
"left 50% right",
|
||||
"left 50px right",
|
||||
"left 50% left",
|
||||
"left 50px left",
|
||||
|
||||
"top 50% bottom",
|
||||
"top 50px bottom",
|
||||
"top 50% top",
|
||||
"top 50px top",
|
||||
|
||||
"bottom 70% top",
|
||||
"bottom 70px top",
|
||||
"bottom 70% bottom",
|
||||
"bottom 70px bottom",
|
||||
|
||||
"right 80% left",
|
||||
"right 80px left",
|
||||
|
||||
////// [ keyword percent | keyword percent], [ keyword percent | keyword length],
|
||||
////// [ keyword length | keyword length], [ keyword length | keyword percent] x 5 keywords
|
||||
"center 60% top 50%",
|
||||
"center 60% top 50px",
|
||||
"center 60% bottom 70%",
|
||||
"center 60% bottom 70px",
|
||||
"center 60% left 50%",
|
||||
"center 60% left 50px",
|
||||
"center 60% right 70%",
|
||||
"center 60% right 70px",
|
||||
"center 60% center 65%",
|
||||
"center 60% center 65px",
|
||||
"center 60px top 50%",
|
||||
"center 60px top 50px",
|
||||
"center 60px bottom 70%",
|
||||
"center 60px bottom 70px",
|
||||
"center 60px left 50%",
|
||||
"center 60px left 50px",
|
||||
"center 60px right 70%",
|
||||
"center 60px right 70px",
|
||||
"center 60px center 65%",
|
||||
"center 60px center 65px",
|
||||
|
||||
"left 50% center 60%",
|
||||
"left 50% center 60px",
|
||||
"left 50% right 80%",
|
||||
"left 50% right 80px",
|
||||
"left 50% left 50%",
|
||||
"left 50% left 50px",
|
||||
"left 50px center 60%",
|
||||
"left 50px center 60px",
|
||||
"left 50px right 80%",
|
||||
"left 50px right 80px",
|
||||
"left 50px left 50%",
|
||||
"left 50px left 50px",
|
||||
|
||||
"top 50% center 60%",
|
||||
"top 50% center 60px",
|
||||
"top 50% bottom 50%",
|
||||
"top 50% bottom 50px",
|
||||
"top 50% top 50%",
|
||||
"top 50% top 50px",
|
||||
"top 50px center 60%",
|
||||
"top 50px center 60px",
|
||||
"top 50px bottom 70%",
|
||||
"top 50px bottom 70px",
|
||||
"top 50px top 50%",
|
||||
"top 50px top 50px",
|
||||
|
||||
"bottom 70% center 60%",
|
||||
"bottom 70% center 60px",
|
||||
"bottom 70% top 50%",
|
||||
"bottom 70% top 50px",
|
||||
"bottom 70% bottom 50%",
|
||||
"bottom 70% bottom 50px",
|
||||
"bottom 70px center 60%",
|
||||
"bottom 70px center 60px",
|
||||
"bottom 70px top 50%",
|
||||
"bottom 70px top 50px",
|
||||
"bottom 70px bottom 50%",
|
||||
"bottom 70px bottom 50px",
|
||||
|
||||
"right 80% center 60%",
|
||||
"right 80% center 60px",
|
||||
"right 80% left 50%",
|
||||
"right 80% left 50px",
|
||||
"right 80% right 85%",
|
||||
"right 80% right 85px",
|
||||
"right 80px center 60%",
|
||||
"right 80px center 60px",
|
||||
"right 80px left 50%",
|
||||
"right 80px left 50px",
|
||||
"right 80px right 85%",
|
||||
"right 80px right 85px"
|
||||
];
|
||||
|
||||
// valid radii values for circle + ellipse
|
||||
// [value, expected_inline, [expected_computed?]]
|
||||
var validCircleRadii = [
|
||||
['', 'at 50% 50%', 'at 50% 50%'],
|
||||
['50u1', '50u1 at 50% 50%'],
|
||||
['50%', '50% at 50% 50%'],
|
||||
['closest-side', 'at 50% 50%'],
|
||||
['farthest-side', 'farthest-side at 50% 50%']
|
||||
]
|
||||
var validEllipseRadii = [
|
||||
['', 'at 50% 50%', 'at 50% 50%'],
|
||||
['50u1', '50u1 at 50% 50%', '50u1 at 50% 50%'],
|
||||
['50%', '50% at 50% 50%', '50% at 50% 50%'],
|
||||
['closest-side', 'at 50% 50%', 'at 50% 50%'],
|
||||
['farthest-side', 'farthest-side at 50% 50%', 'farthest-side at 50% 50%'],
|
||||
['50u1 100u1', '50u1 100u1 at 50% 50%'],
|
||||
['100u1 100px', '100u1 100px at 50% 50%'],
|
||||
['25% 50%', '25% 50% at 50% 50%'],
|
||||
['50u1 25%', '50u1 25% at 50% 50%'],
|
||||
['25% 50u1', '25% 50u1 at 50% 50%'],
|
||||
['25% closest-side', '25% at 50% 50%'],
|
||||
['25u1 closest-side', '25u1 at 50% 50%'],
|
||||
['closest-side 75%', 'closest-side 75% at 50% 50%'],
|
||||
['closest-side 75u1', 'closest-side 75u1 at 50% 50%'],
|
||||
['25% farthest-side', '25% farthest-side at 50% 50%'],
|
||||
['25u1 farthest-side', '25u1 farthest-side at 50% 50%'],
|
||||
['farthest-side 75%', 'farthest-side 75% at 50% 50%'],
|
||||
['farthest-side 75u1', 'farthest-side 75u1 at 50% 50%'],
|
||||
['closest-side closest-side', 'at 50% 50%'],
|
||||
['farthest-side farthest-side', 'farthest-side farthest-side at 50% 50%'],
|
||||
['closest-side farthest-side', 'closest-side farthest-side at 50% 50%'],
|
||||
['farthest-side closest-side', 'farthest-side at 50% 50%']
|
||||
]
|
||||
|
||||
var validInsets = [
|
||||
["One arg - u1", "10u1"],
|
||||
["One arg - u2", "10u2"],
|
||||
["Two args - u1 u1", "10u1 20u1"],
|
||||
["Two args - u1 u2", "10u1 20u2"],
|
||||
["Two args - u2 u1", "10u2 20u1"],
|
||||
["Two args - u2 u2", "10u2 20u2"],
|
||||
["Three args - u1 u1 u1", "10u1 20u1 30u1"],
|
||||
["Three args - u1 u1 u2", "10u1 20u1 30u2"],
|
||||
["Three args - u1 u2 u1", "10u1 20u2 30u1"],
|
||||
["Three args - u1 u2 u2 ", "10u1 20u2 30u2"],
|
||||
["Three args - u2 u1 u1", "10u2 20u1 30u1"],
|
||||
["Three args - u2 u1 u2 ", "10u2 20u1 30u2"],
|
||||
["Three args - u2 u2 u1 ", "10u2 20u2 30u1"],
|
||||
["Three args - u2 u2 u2 ","10u2 20u2 30u2"],
|
||||
["Four args - u1 u1 u1 u1", "10u1 20u1 30u1 40u1"],
|
||||
["Four args - u1 u1 u1 u2", "10u1 20u1 30u1 40u2"],
|
||||
["Four args - u1 u1 u2 u1", "10u1 20u1 30u2 40u1"],
|
||||
["Four args - u1 u1 u2 u2", "10u1 20u1 30u2 40u2"],
|
||||
["Four args - u1 u2 u1 u1", "10u1 20u2 30u1 40u1"],
|
||||
["Four args - u1 u2 u1 u2", "10u1 20u2 30u1 40u2"],
|
||||
["Four args - u1 u2 u2 u1", "10u1 20u2 30u2 40u1"],
|
||||
["Four args - u1 u2 u2 u2", "10u1 20u2 30u2 40u2"],
|
||||
["Four args - u2 u1 u1 u1", "10u2 20u1 30u1 40u1"],
|
||||
["Four args - u2 u1 u1 u2", "10u2 20u1 30u1 40u2"],
|
||||
["Four args - u2 u1 u2 u1", "10u2 20u1 30u2 40u1"],
|
||||
["Four args - u2 u1 u2 u2", "10u2 20u1 30u2 40u2"],
|
||||
["Four args - u2 u2 u1 u1", "10u2 20u2 30u1 40u1"],
|
||||
["Four args - u2 u2 u1 u2", "10u2 20u2 30u1 40u2"],
|
||||
["Four args - u2 u2 u2 u1", "10u2 20u2 30u2 40u1"],
|
||||
["Four args - u2 u2 u2 u2", "10u2 20u2 30u2 40u2"]
|
||||
]
|
||||
|
||||
var validPolygons = [
|
||||
["One vertex - u1 u1", "10u1 20u1"],
|
||||
["One vertex - u1 u2", "10u1 20u2"],
|
||||
["Two vertices - u1 u1, u1 u1", "10u1 20u1, 30u1 40u1"],
|
||||
["Two vertices - u1 u1, u2 u2", "10u1 20u1, 30u2 40u2"],
|
||||
["Two vertices - u2 u2, u1 u1", "10u2 20u2, 30u1 40u1"],
|
||||
["Two vertices - u1 u2, u2 u1", "10u1 20u2, 30u2 40u1"],
|
||||
["Three vertices - u1 u1, u1 u1, u1 u1", "10u1 20u1, 30u1 40u1, 50u1 60u1"],
|
||||
["Three vertices - u2 u2, u2 u2, u2 u2", "10u2 20u2, 30u2 40u2, 50u2 60u2"],
|
||||
["Three vertices - u3 u3, u3 u3, u3 u3", "10u3 20u3, 30u3 40u3, 50u3 60u3"],
|
||||
["Three vertices - u1 u1, u2 u2, u3 u3", "10u1 20u1, 30u2 40u2, 50u3 60u3"],
|
||||
["Three vertices - u3 u3, u1, u1, u2 u2", "10u3 20u3, 30u1 40u1, 50u2 60u2"],
|
||||
]
|
||||
|
||||
// [test value, expected property value, expected computed style]
|
||||
var calcTestValues = [
|
||||
["calc(10in)", "calc(10in)", "960px"],
|
||||
["calc(10in + 20px)", "calc(980px)", "980px"],
|
||||
["calc(30%)", "calc(30%)", "30%"],
|
||||
["calc(100%/4)", "calc(25%)", "25%"],
|
||||
["calc(25%*3)", "calc(75%)", "75%"],
|
||||
// These following two test cases represent an either/or situation in the spec
|
||||
// computed value is always supposed to be, at most, a tuple of a length and a percentage.
|
||||
// the computed value of a ‘calc()’ expression can be represented as either a number or a tuple
|
||||
// of a dimension and a percentage.
|
||||
// http://www.w3.org/TR/css3-values/#calc-notation
|
||||
["calc(25%*3 - 10in)", "calc(75% - 10in)", ["calc(75% - 960px)", "calc(-960px + 75%)"]],
|
||||
["calc((12.5%*6 + 10in) / 4)", "calc((75% + 10in) / 4)", ["calc((75% + 960px) / 4)", "calc(240px + 18.75%)"]]
|
||||
]
|
||||
|
||||
return {
|
||||
testInlineStyle: testInlineStyle,
|
||||
testComputedStyle: testComputedStyle,
|
||||
testShapeMarginInlineStyle: testShapeMarginInlineStyle,
|
||||
testShapeMarginComputedStyle: testShapeMarginComputedStyle,
|
||||
testShapeThresholdInlineStyle: testShapeThresholdInlineStyle,
|
||||
testShapeThresholdComputedStyle: testShapeThresholdComputedStyle,
|
||||
buildTestCases: buildTestCases,
|
||||
buildRadiiTests: buildRadiiTests,
|
||||
buildPositionTests: buildPositionTests,
|
||||
buildInsetTests: buildInsetTests,
|
||||
buildPolygonTests: buildPolygonTests,
|
||||
generateInsetRoundCases: generateInsetRoundCases,
|
||||
buildCalcTests: buildCalcTests,
|
||||
validUnits: validUnits,
|
||||
calcTestValues: calcTestValues,
|
||||
roundResultStr: roundResultStr
|
||||
}
|
||||
})();
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 222 B |
Binary file not shown.
|
After Width: | Height: | Size: 231 B |
Binary file not shown.
|
After Width: | Height: | Size: 223 B |
Binary file not shown.
|
After Width: | Height: | Size: 137 B |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="100px" height="100px" style="background-color: rgba(0,0,0,0.7)" version="1.1">
|
||||
<path fill="#006400" d="M50,0h50c0,33.3,0,66.7,0,100H50V0z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 194 B |
Binary file not shown.
|
After Width: | Height: | Size: 320 B |
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100px" height="100px" version="1.1" x="0px" y="0px">
|
||||
<path fill="#006400" d="M50,0h50c0,33.3,0,66.7,0,100H50V0z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 211 B |
|
|
@ -0,0 +1,5 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="200px" height="200px">
|
||||
<g>
|
||||
<path fill="#AED8E6" d="M167.405,164.386C186.707,183.974,180,200,152.5,200H50c-27.5,0-50-22.5-50-50V44.5 C0,17,15.792,10.526,35.094,30.114L167.405,164.386z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 290 B |
|
|
@ -0,0 +1,26 @@
|
|||
function approxShapeTest(testId, linePrefix, epsilon, lineOffsets) {
|
||||
var isPositioned = { 'relative': true, 'fixed': true, 'absolute': true, 'sticky': true },
|
||||
loops = 0,
|
||||
testDiv = document.getElementById(testId),
|
||||
testOffset = isPositioned[getComputedStyle(testDiv).position] ? 0 : testDiv.offsetLeft,
|
||||
firstLine = document.getElementById(linePrefix + '0');
|
||||
|
||||
function runTest() {
|
||||
if (firstLine.offsetLeft == testOffset) {
|
||||
// wait for the shape image to load and layout to happen
|
||||
if (loops > 100)
|
||||
assert_unreached("Giving up waiting for shape layout to happen!");
|
||||
else
|
||||
loops++;
|
||||
window.setTimeout(runTest, 5);
|
||||
return;
|
||||
}
|
||||
|
||||
for (var i = 0; i < lineOffsets.length; i++) {
|
||||
var line = document.getElementById(linePrefix + i);
|
||||
assert_approx_equals(line.offsetLeft, lineOffsets[i] + testOffset, epsilon, 'Line ' + i + ' is positioned properly');
|
||||
}
|
||||
done();
|
||||
}
|
||||
runTest();
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 92 B |
Binary file not shown.
|
After Width: | Height: | Size: 92 B |
Binary file not shown.
|
After Width: | Height: | Size: 78 B |
Binary file not shown.
|
After Width: | Height: | Size: 84 B |
Binary file not shown.
|
After Width: | Height: | Size: 84 B |
Binary file not shown.
|
After Width: | Height: | Size: 84 B |
Binary file not shown.
|
After Width: | Height: | Size: 84 B |
Binary file not shown.
|
After Width: | Height: | Size: 84 B |
Binary file not shown.
|
After Width: | Height: | Size: 85 B |
Binary file not shown.
|
After Width: | Height: | Size: 84 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
798
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/reftest-toc.xht
Normal file
798
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/reftest-toc.xht
Normal file
|
|
@ -0,0 +1,798 @@
|
|||
|
||||
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<title>CSS Shapes Module Level 1 CR Test Suite Reftest Index</title>
|
||||
<style type="text/css">
|
||||
@import "http://www.w3.org/StyleSheets/TR/base.css";
|
||||
@import "../indices.css";
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<h1>CSS Shapes Module Level 1 CR Test Suite Reftest Index</h1>
|
||||
<table width="100%">
|
||||
<col id="test-column"></col>
|
||||
<col id="ref-column"></col>
|
||||
<col id="flags-column"></col>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Test</th>
|
||||
<th>Reference</th>
|
||||
<th>Flags</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="shape-image-000" class="ahem image">
|
||||
<tr>
|
||||
<td rowspan="1" title="Image shape on a left float">
|
||||
<a href="shape-image-000.xht">shape-image-000</a></td>
|
||||
<td><a href="reference/shape-image-000-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-001" class="ahem image">
|
||||
<tr>
|
||||
<td rowspan="1" title="Image shape on a left float">
|
||||
<a href="shape-image-001.xht">shape-image-001</a></td>
|
||||
<td><a href="reference/shape-image-001-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-002" class="ahem image">
|
||||
<tr>
|
||||
<td rowspan="1" title="Image shape on a left float">
|
||||
<a href="shape-image-002.xht">shape-image-002</a></td>
|
||||
<td><a href="reference/shape-image-002-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-003" class="ahem image">
|
||||
<tr>
|
||||
<td rowspan="1" title="Image shape on a left float">
|
||||
<a href="shape-image-003.xht">shape-image-003</a></td>
|
||||
<td><a href="reference/shape-image-002-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-004" class="ahem image">
|
||||
<tr>
|
||||
<td rowspan="1" title="Image shape on a left float">
|
||||
<a href="shape-image-004.xht">shape-image-004</a></td>
|
||||
<td><a href="reference/shape-image-000-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-005" class="ahem image">
|
||||
<tr>
|
||||
<td rowspan="1" title="Image shape on a left float">
|
||||
<a href="shape-image-005.xht">shape-image-005</a></td>
|
||||
<td><a href="reference/shape-image-002-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-006" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, url(png), real image + shape-margin (px)">
|
||||
<a href="shape-image-006.xht">shape-image-006</a></td>
|
||||
<td><a href="reference/shape-image-006-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-007" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, url(svg), real image + shape-margin (px)">
|
||||
<a href="shape-image-007.xht">shape-image-007</a></td>
|
||||
<td><a href="reference/shape-image-007-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-008" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, url(jpg), data uri + shape-margin (%)">
|
||||
<a href="shape-image-008.xht">shape-image-008</a></td>
|
||||
<td><a href="reference/shape-image-008-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-009" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, url(png), real image 70% + shape-image-threshold + shape-margin (px)">
|
||||
<a href="shape-image-009.xht">shape-image-009</a></td>
|
||||
<td><a href="reference/shape-image-006-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-010" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, url(png), data uri + shape-image-threshold + shape-margin (%)">
|
||||
<a href="shape-image-010.xht">shape-image-010</a></td>
|
||||
<td><a href="reference/shape-image-006-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-011" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, url(svg), real image + shape-image-threshold + shape-margin (px)">
|
||||
<a href="shape-image-011.xht">shape-image-011</a></td>
|
||||
<td><a href="reference/shape-image-007-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-012" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="Wrapping content around right floating actual jpg image">
|
||||
<a href="shape-image-012.xht">shape-image-012</a></td>
|
||||
<td><a href="reference/shape-image-012-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-013" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="Wrapping content around shape given by a right floating png">
|
||||
<a href="shape-image-013.xht">shape-image-013</a></td>
|
||||
<td><a href="reference/shape-image-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-014" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="Wrapping content around shape given by a right floating svg file">
|
||||
<a href="shape-image-014.xht">shape-image-014</a></td>
|
||||
<td><a href="reference/shape-image-002-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-015" class="ahem image">
|
||||
<tr>
|
||||
<td rowspan="1" title="Image shape on a right float">
|
||||
<a href="shape-image-015.xht">shape-image-015</a></td>
|
||||
<td><a href="reference/shape-image-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-016" class="ahem image">
|
||||
<tr>
|
||||
<td rowspan="1" title="Image shape on a right float">
|
||||
<a href="shape-image-016.xht">shape-image-016</a></td>
|
||||
<td><a href="reference/shape-image-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-017" class="ahem image">
|
||||
<tr>
|
||||
<td rowspan="1" title="Image shape on a right float">
|
||||
<a href="shape-image-017.xht">shape-image-017</a></td>
|
||||
<td><a href="reference/shape-image-002-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="image" title="Requires bitmap graphic support">Bitmaps</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-018" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, url(jpg), real image + shape-margin (%)">
|
||||
<a href="shape-image-018.xht">shape-image-018</a></td>
|
||||
<td><a href="reference/shape-image-018-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-019" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, url(png), data uri + shape-margin (px)">
|
||||
<a href="shape-image-019.xht">shape-image-019</a></td>
|
||||
<td><a href="reference/shape-image-019-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-020" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, url(svg), data uri + shape-margin (%)">
|
||||
<a href="shape-image-020.xht">shape-image-020</a></td>
|
||||
<td><a href="reference/shape-image-020-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-021" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, url(png), real image + shape-image-threshold + shape-margin (%)">
|
||||
<a href="shape-image-021.xht">shape-image-021</a></td>
|
||||
<td><a href="reference/shape-image-021-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-022" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, url(gif), real image + shape-image-threshold + shape-margin (px)">
|
||||
<a href="shape-image-022.xht">shape-image-022</a></td>
|
||||
<td><a href="reference/shape-image-022-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-023" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, url(svg), data uri + shape-image-threshold + shape-margin (%)">
|
||||
<a href="shape-image-023.xht">shape-image-023</a></td>
|
||||
<td><a href="reference/shape-image-023-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-024" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="shape-outside from img element with different size than the image file">
|
||||
<a href="shape-image-024.xht">shape-image-024</a></td>
|
||||
<td><a href="reference/shape-image-024-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-image-025" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="shape-outside from first frame of animated gif">
|
||||
<a href="shape-image-025.xht">shape-image-025</a></td>
|
||||
<td><a href="reference/shape-image-025-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-001" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="Left and right float with shape-outside">
|
||||
<a href="shape-outside-001.xht">shape-outside-001</a></td>
|
||||
<td><a href="reference/shape-outside-001-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-002" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="Left and right float with shape-outside with clipped left float">
|
||||
<a href="shape-outside-002.xht">shape-outside-002</a></td>
|
||||
<td><a href="reference/shape-outside-001-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-003" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="Left and right float with shape-outside with clipped right float">
|
||||
<a href="shape-outside-003.xht">shape-outside-003</a></td>
|
||||
<td><a href="reference/shape-outside-001-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-004" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="inset with no extent and inline content - inset(50% 50% 50% 50%)">
|
||||
<a href="shape-outside-004.xht">shape-outside-004</a></td>
|
||||
<td><a href="reference/shape-outside-004-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-005" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="inset with no extent and inline content - inset(150% 150% 0% 0%)">
|
||||
<a href="shape-outside-005.xht">shape-outside-005</a></td>
|
||||
<td><a href="reference/shape-outside-004-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-006" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="shape-outside with open areas on both the left & right of the float area">
|
||||
<a href="shape-outside-006.xht">shape-outside-006</a></td>
|
||||
<td><a href="reference/shape-outside-006-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-007" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="Shape smaller than float content area - 1 float">
|
||||
<a href="shape-outside-007.xht">shape-outside-007</a></td>
|
||||
<td><a href="reference/shape-outside-007-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-008" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="Shape smaller than float content area - 2 floats">
|
||||
<a href="shape-outside-008.xht">shape-outside-008</a></td>
|
||||
<td><a href="reference/shape-outside-008-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-012" class="ahem dom script">
|
||||
<tr>
|
||||
<td rowspan="1" title="Shape from image - shape-image-threshold - 0.9">
|
||||
<a href="shape-outside-012.xht">shape-outside-012</a></td>
|
||||
<td><a href="reference/shape-outside-012-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr><abbr class="script" title="Executes tests in script">Script</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-box-002" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, shape-outside: content-box">
|
||||
<a href="shape-outside-box-002.xht">shape-outside-box-002</a></td>
|
||||
<td><a href="reference/shape-outside-box-001-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-box-003" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, shape-outside: border-box">
|
||||
<a href="shape-outside-box-003.xht">shape-outside-box-003</a></td>
|
||||
<td><a href="reference/shape-outside-box-001-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-box-004" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, shape-outside: padding-box">
|
||||
<a href="shape-outside-box-004.xht">shape-outside-box-004</a></td>
|
||||
<td><a href="reference/shape-outside-box-001-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-box-006" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, shape-outside: content-box">
|
||||
<a href="shape-outside-box-006.xht">shape-outside-box-006</a></td>
|
||||
<td><a href="reference/shape-outside-box-005-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-box-007" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, shape-outside: border-box">
|
||||
<a href="shape-outside-box-007.xht">shape-outside-box-007</a></td>
|
||||
<td><a href="reference/shape-outside-box-005-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-box-008" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, shape-outside: padding-box">
|
||||
<a href="shape-outside-box-008.xht">shape-outside-box-008</a></td>
|
||||
<td><a href="reference/shape-outside-box-005-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-013" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, circle + margin-box + position (px)">
|
||||
<a href="shape-outside-circle-013.xht">shape-outside-circle-013</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-014" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, circle + content-box + radius and position in % units">
|
||||
<a href="shape-outside-circle-014.xht">shape-outside-circle-014</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-015" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, circle + closest-side + padding-box">
|
||||
<a href="shape-outside-circle-015.xht">shape-outside-circle-015</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-016" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, circle + farthest-side + border-box">
|
||||
<a href="shape-outside-circle-016.xht">shape-outside-circle-016</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-017" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, circle + shape-margin in px">
|
||||
<a href="shape-outside-circle-017.xht">shape-outside-circle-017</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-018" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, circle + shape-margin in % units">
|
||||
<a href="shape-outside-circle-018.xht">shape-outside-circle-018</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-019" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, circle at top left + margin-box + shape-margin">
|
||||
<a href="shape-outside-circle-019.xht">shape-outside-circle-019</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-020" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, circle at % + border-box + shape-margin">
|
||||
<a href="shape-outside-circle-020.xht">shape-outside-circle-020</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-021" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, circle + farthest-side + padding-box + shape-margin">
|
||||
<a href="shape-outside-circle-021.xht">shape-outside-circle-021</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-022" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, circle at bottom right + content-box + shape-margin">
|
||||
<a href="shape-outside-circle-022.xht">shape-outside-circle-022</a></td>
|
||||
<td><a href="reference/shape-outside-circle-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-024" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, circle radius in % units + shape-margin + border-box">
|
||||
<a href="shape-outside-circle-024.xht">shape-outside-circle-024</a></td>
|
||||
<td><a href="reference/shape-outside-circle-023-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-025" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, circle + shape-margin + padding-box">
|
||||
<a href="shape-outside-circle-025.xht">shape-outside-circle-025</a></td>
|
||||
<td><a href="reference/shape-outside-circle-023-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-026" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, circle + shape-margin + content-box">
|
||||
<a href="shape-outside-circle-026.xht">shape-outside-circle-026</a></td>
|
||||
<td><a href="reference/shape-outside-circle-023-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-027" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, circle with radius in % units + shape-margin + margin-box">
|
||||
<a href="shape-outside-circle-027.xht">shape-outside-circle-027</a></td>
|
||||
<td><a href="reference/shape-outside-circle-023-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-028" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, circle(closest-side) at position % + shape-margin + border-box">
|
||||
<a href="shape-outside-circle-028.xht">shape-outside-circle-028</a></td>
|
||||
<td><a href="reference/shape-outside-circle-023-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-029" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, circle at center right + shape-margin + padding-box">
|
||||
<a href="shape-outside-circle-029.xht">shape-outside-circle-029</a></td>
|
||||
<td><a href="reference/shape-outside-circle-023-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-030" class="ahem dom">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, circle radius in px units">
|
||||
<a href="shape-outside-circle-030.xht">shape-outside-circle-030</a></td>
|
||||
<td><a href="reference/shape-outside-circle-030-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-circle-031" class="ahem dom">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, circle radius in % units">
|
||||
<a href="shape-outside-circle-031.xht">shape-outside-circle-031</a></td>
|
||||
<td><a href="reference/shape-outside-circle-030-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-013" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, ellipse radii and position in px">
|
||||
<a href="shape-outside-ellipse-013.xht">shape-outside-ellipse-013</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-014" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, ellipse radii and position in % units + content-box">
|
||||
<a href="shape-outside-ellipse-014.xht">shape-outside-ellipse-014</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-015" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, ellipse + closest-side + padding-box">
|
||||
<a href="shape-outside-ellipse-015.xht">shape-outside-ellipse-015</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-016" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, ellipse radii in % units + padding-box">
|
||||
<a href="shape-outside-ellipse-016.xht">shape-outside-ellipse-016</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-017" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, ellipse(farthest-side) + shape-margin + content-box">
|
||||
<a href="shape-outside-ellipse-017.xht">shape-outside-ellipse-017</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-018" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, ellipse + shape-margin in % units">
|
||||
<a href="shape-outside-ellipse-018.xht">shape-outside-ellipse-018</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-019" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, ellipse radii in % units + padding-box + shape-margin">
|
||||
<a href="shape-outside-ellipse-019.xht">shape-outside-ellipse-019</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-020" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, ellipse radii in % units + margin-box + shape-margin">
|
||||
<a href="shape-outside-ellipse-020.xht">shape-outside-ellipse-020</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-013-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-021" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, ellipse (closest-side px) + shape-margin + padding box">
|
||||
<a href="shape-outside-ellipse-021.xht">shape-outside-ellipse-021</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-021-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-022" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, ellipse(closest-side px) + shape-margin + content-box">
|
||||
<a href="shape-outside-ellipse-022.xht">shape-outside-ellipse-022</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-021-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-023" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, ellipse + shape-margin">
|
||||
<a href="shape-outside-ellipse-023.xht">shape-outside-ellipse-023</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-021-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-024" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, ellipse at position (%) + shape-margin (%) + border-box">
|
||||
<a href="shape-outside-ellipse-024.xht">shape-outside-ellipse-024</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-021-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-025" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, ellipse radii in % at center right + shape-margin + padding-box">
|
||||
<a href="shape-outside-ellipse-025.xht">shape-outside-ellipse-025</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-021-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-030" class="ahem dom">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, ellipse radii in px">
|
||||
<a href="shape-outside-ellipse-030.xht">shape-outside-ellipse-030</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-030-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-ellipse-031" class="ahem dom">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, ellipse radii in % units">
|
||||
<a href="shape-outside-ellipse-031.xht">shape-outside-ellipse-031</a></td>
|
||||
<td><a href="reference/shape-outside-ellipse-030-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-inset-010" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, inset, px units">
|
||||
<a href="shape-outside-inset-010.xht">shape-outside-inset-010</a></td>
|
||||
<td><a href="reference/shape-outside-inset-010-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-inset-011" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, inset, % units">
|
||||
<a href="shape-outside-inset-011.xht">shape-outside-inset-011</a></td>
|
||||
<td><a href="reference/shape-outside-inset-010-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-inset-012" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, inset + margin-box">
|
||||
<a href="shape-outside-inset-012.xht">shape-outside-inset-012</a></td>
|
||||
<td><a href="reference/shape-outside-inset-010-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-inset-013" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, inset + border-box">
|
||||
<a href="shape-outside-inset-013.xht">shape-outside-inset-013</a></td>
|
||||
<td><a href="reference/shape-outside-inset-010-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-inset-014" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, inset + content-box">
|
||||
<a href="shape-outside-inset-014.xht">shape-outside-inset-014</a></td>
|
||||
<td><a href="reference/shape-outside-inset-010-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-inset-015" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, inset + padding-box">
|
||||
<a href="shape-outside-inset-015.xht">shape-outside-inset-015</a></td>
|
||||
<td><a href="reference/shape-outside-inset-010-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-linear-gradient-001" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="Left float with linear gradient">
|
||||
<a href="shape-outside-linear-gradient-001.xht">shape-outside-linear-gradient-001</a></td>
|
||||
<td><a href="reference/shape-outside-linear-gradient-001-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-linear-gradient-002" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="Right float with linear gradient">
|
||||
<a href="shape-outside-linear-gradient-002.xht">shape-outside-linear-gradient-002</a></td>
|
||||
<td><a href="reference/shape-outside-linear-gradient-002-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-linear-gradient-003" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="Right float with linear gradient">
|
||||
<a href="shape-outside-linear-gradient-003.xht">shape-outside-linear-gradient-003</a></td>
|
||||
<td><a href="reference/shape-outside-linear-gradient-002-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-linear-gradient-004" class="">
|
||||
<tr>
|
||||
<td rowspan="1" title="Shape outside and repeating linear gradient">
|
||||
<a href="shape-outside-linear-gradient-004.xht">shape-outside-linear-gradient-004</a></td>
|
||||
<td><a href="reference/shape-outside-linear-gradient-004-ref.xht">=</a> </td>
|
||||
<td rowspan="1"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-polygon-007" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, polygon, args in px units">
|
||||
<a href="shape-outside-polygon-007.xht">shape-outside-polygon-007</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-007-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-polygon-008" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, polygon, args in % units">
|
||||
<a href="shape-outside-polygon-008.xht">shape-outside-polygon-008</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-007-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-polygon-009" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, polygon + border box">
|
||||
<a href="shape-outside-polygon-009.xht">shape-outside-polygon-009</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-007-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-polygon-010" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, polygon + padding box">
|
||||
<a href="shape-outside-polygon-010.xht">shape-outside-polygon-010</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-010-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-polygon-011" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="left float, polygon + content box">
|
||||
<a href="shape-outside-polygon-011.xht">shape-outside-polygon-011</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-010-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-polygon-012" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, polygon + margin-box + shape-margin">
|
||||
<a href="shape-outside-polygon-012.xht">shape-outside-polygon-012</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-010-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-polygon-013" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, polygon + border-box + shape-margin">
|
||||
<a href="shape-outside-polygon-013.xht">shape-outside-polygon-013</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-010-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-polygon-014" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, polygon + padding-box + shape-margin">
|
||||
<a href="shape-outside-polygon-014.xht">shape-outside-polygon-014</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-010-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-polygon-015" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, polygon + content-box + shape-margin">
|
||||
<a href="shape-outside-polygon-015.xht">shape-outside-polygon-015</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-010-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-polygon-016" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="polygon, evenodd">
|
||||
<a href="shape-outside-polygon-016.xht">shape-outside-polygon-016</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-010-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-polygon-017" class="ahem">
|
||||
<tr>
|
||||
<td rowspan="1" title="right float, polygon + shape-margin beyond margin box">
|
||||
<a href="shape-outside-polygon-017.xht">shape-outside-polygon-017</a></td>
|
||||
<td><a href="reference/shape-outside-polygon-017-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tbody id="shape-outside-radial-gradient-001" class="ahem dom">
|
||||
<tr>
|
||||
<td rowspan="1" title="Left float with radial gradient">
|
||||
<a href="shape-outside-radial-gradient-001.xht">shape-outside-radial-gradient-001</a></td>
|
||||
<td><a href="reference/shape-outside-radial-gradient-001-ref.xht">=</a> </td>
|
||||
<td rowspan="1"><abbr class="ahem" title="Requires Ahem font">Ahem</abbr><abbr class="dom" title="Requires Document Object Model support">DOM/JS</abbr></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
97
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/reftest.list
Normal file
97
tests/wpt/css-tests/css-shapes-1_dev/xhtml1/reftest.list
Normal file
|
|
@ -0,0 +1,97 @@
|
|||
|
||||
shape-image-000.xht == reference/shape-image-000-ref.xht
|
||||
shape-image-001.xht == reference/shape-image-001-ref.xht
|
||||
shape-image-002.xht == reference/shape-image-002-ref.xht
|
||||
shape-image-003.xht == reference/shape-image-002-ref.xht
|
||||
shape-image-004.xht == reference/shape-image-000-ref.xht
|
||||
shape-image-005.xht == reference/shape-image-002-ref.xht
|
||||
shape-image-006.xht == reference/shape-image-006-ref.xht
|
||||
shape-image-007.xht == reference/shape-image-007-ref.xht
|
||||
shape-image-008.xht == reference/shape-image-008-ref.xht
|
||||
shape-image-009.xht == reference/shape-image-006-ref.xht
|
||||
shape-image-010.xht == reference/shape-image-006-ref.xht
|
||||
shape-image-011.xht == reference/shape-image-007-ref.xht
|
||||
shape-image-012.xht == reference/shape-image-012-ref.xht
|
||||
shape-image-013.xht == reference/shape-image-013-ref.xht
|
||||
shape-image-014.xht == reference/shape-image-002-ref.xht
|
||||
shape-image-015.xht == reference/shape-image-013-ref.xht
|
||||
shape-image-016.xht == reference/shape-image-013-ref.xht
|
||||
shape-image-017.xht == reference/shape-image-002-ref.xht
|
||||
shape-image-018.xht == reference/shape-image-018-ref.xht
|
||||
shape-image-019.xht == reference/shape-image-019-ref.xht
|
||||
shape-image-020.xht == reference/shape-image-020-ref.xht
|
||||
shape-image-021.xht == reference/shape-image-021-ref.xht
|
||||
shape-image-022.xht == reference/shape-image-022-ref.xht
|
||||
shape-image-023.xht == reference/shape-image-023-ref.xht
|
||||
shape-image-024.xht == reference/shape-image-024-ref.xht
|
||||
shape-image-025.xht == reference/shape-image-025-ref.xht
|
||||
shape-outside-001.xht == reference/shape-outside-001-ref.xht
|
||||
shape-outside-002.xht == reference/shape-outside-001-ref.xht
|
||||
shape-outside-003.xht == reference/shape-outside-001-ref.xht
|
||||
shape-outside-004.xht == reference/shape-outside-004-ref.xht
|
||||
shape-outside-005.xht == reference/shape-outside-004-ref.xht
|
||||
shape-outside-006.xht == reference/shape-outside-006-ref.xht
|
||||
shape-outside-007.xht == reference/shape-outside-007-ref.xht
|
||||
shape-outside-008.xht == reference/shape-outside-008-ref.xht
|
||||
shape-outside-012.xht == reference/shape-outside-012-ref.xht
|
||||
shape-outside-box-002.xht == reference/shape-outside-box-001-ref.xht
|
||||
shape-outside-box-003.xht == reference/shape-outside-box-001-ref.xht
|
||||
shape-outside-box-004.xht == reference/shape-outside-box-001-ref.xht
|
||||
shape-outside-box-006.xht == reference/shape-outside-box-005-ref.xht
|
||||
shape-outside-box-007.xht == reference/shape-outside-box-005-ref.xht
|
||||
shape-outside-box-008.xht == reference/shape-outside-box-005-ref.xht
|
||||
shape-outside-circle-013.xht == reference/shape-outside-circle-013-ref.xht
|
||||
shape-outside-circle-014.xht == reference/shape-outside-circle-013-ref.xht
|
||||
shape-outside-circle-015.xht == reference/shape-outside-circle-013-ref.xht
|
||||
shape-outside-circle-016.xht == reference/shape-outside-circle-013-ref.xht
|
||||
shape-outside-circle-017.xht == reference/shape-outside-circle-013-ref.xht
|
||||
shape-outside-circle-018.xht == reference/shape-outside-circle-013-ref.xht
|
||||
shape-outside-circle-019.xht == reference/shape-outside-circle-013-ref.xht
|
||||
shape-outside-circle-020.xht == reference/shape-outside-circle-013-ref.xht
|
||||
shape-outside-circle-021.xht == reference/shape-outside-circle-013-ref.xht
|
||||
shape-outside-circle-022.xht == reference/shape-outside-circle-013-ref.xht
|
||||
shape-outside-circle-024.xht == reference/shape-outside-circle-023-ref.xht
|
||||
shape-outside-circle-025.xht == reference/shape-outside-circle-023-ref.xht
|
||||
shape-outside-circle-026.xht == reference/shape-outside-circle-023-ref.xht
|
||||
shape-outside-circle-027.xht == reference/shape-outside-circle-023-ref.xht
|
||||
shape-outside-circle-028.xht == reference/shape-outside-circle-023-ref.xht
|
||||
shape-outside-circle-029.xht == reference/shape-outside-circle-023-ref.xht
|
||||
shape-outside-circle-030.xht == reference/shape-outside-circle-030-ref.xht
|
||||
shape-outside-circle-031.xht == reference/shape-outside-circle-030-ref.xht
|
||||
shape-outside-ellipse-013.xht == reference/shape-outside-ellipse-013-ref.xht
|
||||
shape-outside-ellipse-014.xht == reference/shape-outside-ellipse-013-ref.xht
|
||||
shape-outside-ellipse-015.xht == reference/shape-outside-ellipse-013-ref.xht
|
||||
shape-outside-ellipse-016.xht == reference/shape-outside-ellipse-013-ref.xht
|
||||
shape-outside-ellipse-017.xht == reference/shape-outside-ellipse-013-ref.xht
|
||||
shape-outside-ellipse-018.xht == reference/shape-outside-ellipse-013-ref.xht
|
||||
shape-outside-ellipse-019.xht == reference/shape-outside-ellipse-013-ref.xht
|
||||
shape-outside-ellipse-020.xht == reference/shape-outside-ellipse-013-ref.xht
|
||||
shape-outside-ellipse-021.xht == reference/shape-outside-ellipse-021-ref.xht
|
||||
shape-outside-ellipse-022.xht == reference/shape-outside-ellipse-021-ref.xht
|
||||
shape-outside-ellipse-023.xht == reference/shape-outside-ellipse-021-ref.xht
|
||||
shape-outside-ellipse-024.xht == reference/shape-outside-ellipse-021-ref.xht
|
||||
shape-outside-ellipse-025.xht == reference/shape-outside-ellipse-021-ref.xht
|
||||
shape-outside-ellipse-030.xht == reference/shape-outside-ellipse-030-ref.xht
|
||||
shape-outside-ellipse-031.xht == reference/shape-outside-ellipse-030-ref.xht
|
||||
shape-outside-inset-010.xht == reference/shape-outside-inset-010-ref.xht
|
||||
shape-outside-inset-011.xht == reference/shape-outside-inset-010-ref.xht
|
||||
shape-outside-inset-012.xht == reference/shape-outside-inset-010-ref.xht
|
||||
shape-outside-inset-013.xht == reference/shape-outside-inset-010-ref.xht
|
||||
shape-outside-inset-014.xht == reference/shape-outside-inset-010-ref.xht
|
||||
shape-outside-inset-015.xht == reference/shape-outside-inset-010-ref.xht
|
||||
shape-outside-linear-gradient-001.xht == reference/shape-outside-linear-gradient-001-ref.xht
|
||||
shape-outside-linear-gradient-002.xht == reference/shape-outside-linear-gradient-002-ref.xht
|
||||
shape-outside-linear-gradient-003.xht == reference/shape-outside-linear-gradient-002-ref.xht
|
||||
shape-outside-linear-gradient-004.xht == reference/shape-outside-linear-gradient-004-ref.xht
|
||||
shape-outside-polygon-007.xht == reference/shape-outside-polygon-007-ref.xht
|
||||
shape-outside-polygon-008.xht == reference/shape-outside-polygon-007-ref.xht
|
||||
shape-outside-polygon-009.xht == reference/shape-outside-polygon-007-ref.xht
|
||||
shape-outside-polygon-010.xht == reference/shape-outside-polygon-010-ref.xht
|
||||
shape-outside-polygon-011.xht == reference/shape-outside-polygon-010-ref.xht
|
||||
shape-outside-polygon-012.xht == reference/shape-outside-polygon-010-ref.xht
|
||||
shape-outside-polygon-013.xht == reference/shape-outside-polygon-010-ref.xht
|
||||
shape-outside-polygon-014.xht == reference/shape-outside-polygon-010-ref.xht
|
||||
shape-outside-polygon-015.xht == reference/shape-outside-polygon-010-ref.xht
|
||||
shape-outside-polygon-016.xht == reference/shape-outside-polygon-010-ref.xht
|
||||
shape-outside-polygon-017.xht == reference/shape-outside-polygon-017-ref.xht
|
||||
shape-outside-radial-gradient-001.xht == reference/shape-outside-radial-gradient-001-ref.xht
|
||||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Add table
Add a link
Reference in a new issue