mirror of
https://github.com/servo/servo.git
synced 2025-06-23 08:34:42 +01:00
296fa2512b
- Update CSS tests to revision e05bfd5e30ed662c2f8a353577003f8eed230180. - Update web-platform-tests to revision a052787dd5c069a340031011196b73affbd68cd9.
1000 lines
No EOL
52 KiB
HTML
1000 lines
No EOL
52 KiB
HTML
|
|
|
|
<!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 (80 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="https://www.w3.org/TR/css-shapes-1/#shapes-from-box-values">5 Shapes from Box Values</a></th></tr>
|
|
<!-- 47 tests -->
|
|
<tr id="shape-outside-014-5" class="ahem dom script">
|
|
<td>
|
|
<a href="shape-outside-014.xht">shape-outside-014</a></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="ahem dom script">
|
|
<td>
|
|
<a href="shape-outside-015.xht">shape-outside-015</a></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="ahem dom script">
|
|
<td>
|
|
<a href="shape-outside-016.xht">shape-outside-016</a></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="ahem dom script">
|
|
<td>
|
|
<a href="shape-outside-017.xht">shape-outside-017</a></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="ahem dom script">
|
|
<td>
|
|
<a href="shape-outside-018.xht">shape-outside-018</a></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-border-box-001-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-border-box-001.xht">shape-outside-border-box-001</a></strong></td>
|
|
<td><a href="reference/shape-outside-border-box-001-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float left, border-box
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the border-box value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-border-box-002-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-border-box-002.xht">shape-outside-border-box-002</a></strong></td>
|
|
<td><a href="reference/shape-outside-border-box-002-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float right, border-box
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape defined by the border-box value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-border-box-border-radius-001-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-border-box-border-radius-001.xht">shape-outside-border-box-border-radius-001</a></strong></td>
|
|
<td><a href="reference/shape-outside-border-box-border-radius-001-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float left, border-box, border-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the border-box and border-radius value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-border-box-border-radius-002-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-border-box-border-radius-002.xht">shape-outside-border-box-border-radius-002</a></strong></td>
|
|
<td><a href="reference/shape-outside-border-box-border-radius-002-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float left, border-box, border-radius, no margin
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the border-box and border-radius value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-border-box-border-radius-003-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-border-box-border-radius-003.xht">shape-outside-border-box-border-radius-003</a></strong></td>
|
|
<td><a href="reference/shape-outside-border-box-border-radius-003-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float right, border-box, border-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape defined by the border-box and border-radius value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-border-box-border-radius-004-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-border-box-border-radius-004.xht">shape-outside-border-box-border-radius-004</a></strong></td>
|
|
<td><a href="reference/shape-outside-border-box-border-radius-004-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float right, border-box, border-radius, no margin
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape defined by the border-box and border-radius value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-border-box-border-radius-005-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-border-box-border-radius-005.xht">shape-outside-border-box-border-radius-005</a></strong></td>
|
|
<td><a href="reference/shape-outside-border-box-border-radius-005-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>vertical-rl, float left, border-box, border-bottom-right-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the border-box and border-bottom-right-radius value under vertical-rl writing-mode.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-border-box-border-radius-006-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-border-box-border-radius-006.xht">shape-outside-border-box-border-radius-006</a></strong></td>
|
|
<td><a href="reference/shape-outside-border-box-border-radius-006-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>vertical-rl, float right, border-box, border-top-right-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape defined by the border-box and border-top-right-radius value under vertical-rl writing-mode.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-border-box-border-radius-007-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-border-box-border-radius-007.xht">shape-outside-border-box-border-radius-007</a></strong></td>
|
|
<td><a href="reference/shape-outside-border-box-border-radius-007-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>vertical-lr, float left, border-box, border-bottom-right-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the border-box and border-bottom-right-radius value under vertical-lr writing-mode.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-border-box-border-radius-008-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-border-box-border-radius-008.xht">shape-outside-border-box-border-radius-008</a></strong></td>
|
|
<td><a href="reference/shape-outside-border-box-border-radius-008-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>vertical-lr, float right, border-box, border-top-right-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape defined by the border-box and border-top-right-radius value under vertical-lr writing-mode.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-border-box-border-radius-009-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-border-box-border-radius-009.xht">shape-outside-border-box-border-radius-009</a></strong></td>
|
|
<td><a href="reference/shape-outside-border-box-border-radius-009-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>sideways-rl, float left, border-box, border-bottom-right-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the border-box and border-bottom-right-radius value under sideways-rl writing-mode.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-border-box-border-radius-010-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-border-box-border-radius-010.xht">shape-outside-border-box-border-radius-010</a></strong></td>
|
|
<td><a href="reference/shape-outside-border-box-border-radius-010-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>sideways-rl, float right, border-box, border-top-right-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape defined by the border-box and border-top-right-radius value under sideways-rl writing-mode.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-border-box-border-radius-011-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-border-box-border-radius-011.xht">shape-outside-border-box-border-radius-011</a></strong></td>
|
|
<td><a href="reference/shape-outside-border-box-border-radius-011-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>sideways-lr, float left, border-box, border-top-right-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the border-box and border-top-right-radius value under sideways-lr writing-mode.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-border-box-border-radius-012-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-border-box-border-radius-012.xht">shape-outside-border-box-border-radius-012</a></strong></td>
|
|
<td><a href="reference/shape-outside-border-box-border-radius-012-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>sideways-lr, float right, border-box, border-bottom-right-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape defined by the border-box and border-bottom-right-radius value under sideways-lr writing-mode.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-box-002-5" 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-003-5" 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-004-5" 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-006-5" 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-box-007-5" 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-box-008-5" 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-content-box-001-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-content-box-001.xht">shape-outside-content-box-001</a></strong></td>
|
|
<td><a href="reference/shape-outside-content-box-001-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float left, content-box
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the content-box value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-content-box-002-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-content-box-002.xht">shape-outside-content-box-002</a></strong></td>
|
|
<td><a href="reference/shape-outside-content-box-002-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float right, content-box
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape defined by the content-box value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-content-box-border-radius-001-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-content-box-border-radius-001.xht">shape-outside-content-box-border-radius-001</a></strong></td>
|
|
<td><a href="reference/shape-outside-content-box-border-radius-001-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float left, content-box, border-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the content-box and border-radius value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-content-box-border-radius-002-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-content-box-border-radius-002.xht">shape-outside-content-box-border-radius-002</a></strong></td>
|
|
<td><a href="reference/shape-outside-content-box-border-radius-002-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float right, content-box, border-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape defined by the content-box and border-radius value.</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>
|
|
<tr id="shape-outside-margin-box-001-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-margin-box-001.xht">shape-outside-margin-box-001</a></strong></td>
|
|
<td><a href="reference/shape-outside-margin-box-001-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float left, margin-box
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the margin-box value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-margin-box-002-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-margin-box-002.xht">shape-outside-margin-box-002</a></strong></td>
|
|
<td><a href="reference/shape-outside-margin-box-002-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float right, margin-box
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape defined by the margin-box value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-margin-box-border-radius-001-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-margin-box-border-radius-001.xht">shape-outside-margin-box-border-radius-001</a></strong></td>
|
|
<td><a href="reference/shape-outside-margin-box-border-radius-001-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float left, margin-box, border-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the margin-box and border-radius value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-margin-box-border-radius-002-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-margin-box-border-radius-002.xht">shape-outside-margin-box-border-radius-002</a></strong></td>
|
|
<td><a href="reference/shape-outside-margin-box-border-radius-002-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float left, margin-box, border-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the margin-box and border-radius value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-margin-box-border-radius-003-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-margin-box-border-radius-003.xht">shape-outside-margin-box-border-radius-003</a></strong></td>
|
|
<td><a href="reference/shape-outside-margin-box-border-radius-003-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float right, margin-box, border-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape defined by the margin-box and border-radius value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-margin-box-border-radius-004-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-margin-box-border-radius-004.xht">shape-outside-margin-box-border-radius-004</a></strong></td>
|
|
<td><a href="reference/shape-outside-margin-box-border-radius-004-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float right, margin-box, border-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape defined by the margin-box and border-radius value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-margin-box-border-radius-005-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-margin-box-border-radius-005.xht">shape-outside-margin-box-border-radius-005</a></strong></td>
|
|
<td><a href="reference/shape-outside-margin-box-border-radius-005-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float left, margin-box, border-top-right-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the margin-box and border-top-right-radius value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-margin-box-border-radius-006-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-margin-box-border-radius-006.xht">shape-outside-margin-box-border-radius-006</a></strong></td>
|
|
<td><a href="reference/shape-outside-margin-box-border-radius-006-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float left, margin-box, border-bottom-right-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the margin-box and border-bottom-right-radius value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-margin-box-border-radius-007-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-margin-box-border-radius-007.xht">shape-outside-margin-box-border-radius-007</a></strong></td>
|
|
<td><a href="reference/shape-outside-margin-box-border-radius-007-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float left in rtl container, margin-box, border-top-right-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape in rtl container defined by the margin-box and border-top-right-radius value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-margin-box-border-radius-008-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-margin-box-border-radius-008.xht">shape-outside-margin-box-border-radius-008</a></strong></td>
|
|
<td><a href="reference/shape-outside-margin-box-border-radius-008-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float right in ltr container, margin-box, border-top-left-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape in ltr container defined by the margin-box and border-top-left-radius value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-padding-box-001-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-padding-box-001.xht">shape-outside-padding-box-001</a></strong></td>
|
|
<td><a href="reference/shape-outside-padding-box-001-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float left, padding-box
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the padding-box value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-padding-box-002-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-padding-box-002.xht">shape-outside-padding-box-002</a></strong></td>
|
|
<td><a href="reference/shape-outside-padding-box-002-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float right, padding-box
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape defined by the padding-box value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-padding-box-border-radius-001-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-padding-box-border-radius-001.xht">shape-outside-padding-box-border-radius-001</a></strong></td>
|
|
<td><a href="reference/shape-outside-padding-box-border-radius-001-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float left, padding-box, border-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the left float shape defined by the padding-box and border-radius value.</li>
|
|
</ul>
|
|
</td>
|
|
</tr>
|
|
<tr id="shape-outside-padding-box-border-radius-002-5" class="primary">
|
|
<td><strong>
|
|
<a href="shape-outside-padding-box-border-radius-002.xht">shape-outside-padding-box-border-radius-002</a></strong></td>
|
|
<td><a href="reference/shape-outside-padding-box-border-radius-002-ref.xht">=</a> </td>
|
|
<td></td>
|
|
<td>float right, padding-box, border-radius
|
|
<ul class="assert">
|
|
<li>Test the boxes are wrapping around the right float shape defined by the padding-box and border-radius value.</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> |