[CSS Shapes] New positioning model: Negative margins
authorbjonesbe@adobe.com <bjonesbe@adobe.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 11 Oct 2013 16:53:07 +0000 (16:53 +0000)
committerbjonesbe@adobe.com <bjonesbe@adobe.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 11 Oct 2013 16:53:07 +0000 (16:53 +0000)
https://bugs.webkit.org/show_bug.cgi?id=118090

Reviewed by Darin Adler.

Tests for shape-outside with negative margins:

negative top margin
negative left margin
negative right margin
negative bottom margin
negative top margin vertical right-left writing mode
negative left margin vertical right-left writing mode
negative right margin vertical right-left writing mode
negative bottom margin vertical right-left writing mode
negative top margin vertical left-right writing mode
negative left margin vertical left-right writing mode
negative right margin vertical left-right writing mode
negative bottom margin vertical left-right writing mode

* csswg/contributors/adobe/submitted/shapes/shape-outside/resources/w3c-import.log:
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-010-expected.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-010.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-011-expected.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-011.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-012-expected.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-012.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-013-expected.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-013.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-014-expected.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-014.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-015-expected.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-015.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-016-expected.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-016.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-017-expected.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-017.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-018-expected.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-018.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-019-expected.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-019.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-020-expected.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-020.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-021-expected.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-021.html: Added.
* csswg/contributors/adobe/submitted/shapes/shape-outside/w3c-import.log:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@157305 268f45cc-cd09-0410-ab3c-d52691b4dbfc

27 files changed:
LayoutTests/ChangeLog
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/resources/w3c-import.log
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-010-expected.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-010.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-011-expected.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-011.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-012-expected.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-012.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-013-expected.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-013.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-014-expected.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-014.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-015-expected.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-015.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-016-expected.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-016.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-017-expected.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-017.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-018-expected.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-018.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-019-expected.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-019.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-020-expected.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-020.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-021-expected.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-021.html [new file with mode: 0644]
LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/w3c-import.log

index 05c057d..592c116 100644 (file)
@@ -1,3 +1,52 @@
+2013-10-11  Bem Jones-Bey  <bjonesbe@adobe.com>
+
+        [CSS Shapes] New positioning model: Negative margins
+        https://bugs.webkit.org/show_bug.cgi?id=118090
+
+        Reviewed by Darin Adler.
+
+        Tests for shape-outside with negative margins:
+
+        negative top margin
+        negative left margin
+        negative right margin
+        negative bottom margin
+        negative top margin vertical right-left writing mode
+        negative left margin vertical right-left writing mode
+        negative right margin vertical right-left writing mode
+        negative bottom margin vertical right-left writing mode
+        negative top margin vertical left-right writing mode
+        negative left margin vertical left-right writing mode
+        negative right margin vertical left-right writing mode
+        negative bottom margin vertical left-right writing mode
+
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/resources/w3c-import.log:
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-010-expected.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-010.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-011-expected.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-011.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-012-expected.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-012.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-013-expected.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-013.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-014-expected.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-014.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-015-expected.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-015.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-016-expected.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-016.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-017-expected.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-017.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-018-expected.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-018.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-019-expected.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-019.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-020-expected.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-020.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-021-expected.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-021.html: Added.
+        * csswg/contributors/adobe/submitted/shapes/shape-outside/w3c-import.log:
+
 2013-10-11  Krzysztof Czech  <k.czech@samsung.com>
 
         [EFL] Added new accessibility expectation after r154697
index 4db8a01..3b263a3 100644 (file)
@@ -8,7 +8,7 @@ Then run the Tools/Scripts/import-w3c-tests in Webkit to reimport
 Do NOT modify or remove this file
 
 ------------------------------------------------------------------------
-Last Import: 2013-10-10 09:20
+Last Import: 2013-10-10 15:56
 W3C Mercurial changeset: Not Available
 Test status at time of import: unknown
 ------------------------------------------------------------------------
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-010-expected.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-010-expected.html
new file mode 100644 (file)
index 0000000..c37fc73
--- /dev/null
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<title>CSS Reference</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 100px;
+    height: 20px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on opposite sides.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        XXXX
+    </div>
+    <div class="container">
+        <div id="float-right">
+        </div>
+        XXXX
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-010.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-010.html
new file mode 100644 (file)
index 0000000..a21b2ce
--- /dev/null
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<title>CSS Test: shape-outside on floats with a negative margin</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<link rel="match" href="shape-outside-floats-margin-000-ref.html">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 100px;
+    height: 20px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+}
+
+#float-left {
+    float: left;
+    width: 100px;
+    height: 20px;
+    -webkit-shape-outside: rectangle(0, 0, 20%, 100%);
+    margin-left: -20px;
+}
+
+#float-right {
+    float: right;
+    width: 100px;
+    height: 20px;
+    -webkit-shape-outside: rectangle(80%, 0, 20%, 100%);
+    margin-right: -20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on opposite sides.</p>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        XXXX
+    </div>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        XXXX
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-011-expected.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-011-expected.html
new file mode 100644 (file)
index 0000000..c37fc73
--- /dev/null
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<title>CSS Reference</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 100px;
+    height: 20px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on opposite sides.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        XXXX
+    </div>
+    <div class="container">
+        <div id="float-right">
+        </div>
+        XXXX
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-011.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-011.html
new file mode 100644 (file)
index 0000000..aa31431
--- /dev/null
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<title>CSS Test: shape-outside on floats with a negative margin</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<link rel="match" href="shape-outside-floats-margin-000-ref.html">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 100px;
+    height: 20px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+}
+
+#float-left {
+    float: left;
+    width: 100px;
+    height: 20px;
+    -webkit-shape-outside: rectangle(0, 0, 20%, 100%);
+    margin-right: -20px;
+}
+
+#float-right {
+    float: right;
+    width: 100px;
+    height: 20px;
+    -webkit-shape-outside: rectangle(80%, 0, 20%, 100%);
+    margin-left: -20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on opposite sides.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        XXXX
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        XXXX
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-012-expected.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-012-expected.html
new file mode 100644 (file)
index 0000000..03cfaed
--- /dev/null
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<title>CSS Reference</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 20px;
+    height: 100px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on one end.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        X X X X
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        X X X X
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-012.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-012.html
new file mode 100644 (file)
index 0000000..0e565a2
--- /dev/null
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<title>CSS Test: shape-outside on floats with a negative top margin</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<link rel="match" href="shape-outside-floats-margin-012-ref.html">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 20px;
+    height: 100px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 40px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 100%);
+    margin-top: -20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 40px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 100%);
+    margin-top: -20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on one end.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        X X X X
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        X X X X
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-013-expected.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-013-expected.html
new file mode 100644 (file)
index 0000000..03cfaed
--- /dev/null
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<title>CSS Reference</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 20px;
+    height: 100px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on one end.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        X X X X
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        X X X X
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-013.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-013.html
new file mode 100644 (file)
index 0000000..acead0c
--- /dev/null
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<title>CSS Test: shape-outside on floats with a negative bottom margin</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<link rel="match" href="shape-outside-floats-margin-012-ref.html">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 20px;
+    height: 100px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 40px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 100%);
+    margin-bottom: -20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 40px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 100%);
+    margin-bottom: -20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on one end.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        X X X X
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        X X X X
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-014-expected.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-014-expected.html
new file mode 100644 (file)
index 0000000..7c06309
--- /dev/null
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<title>CSS Reference</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 20px;
+    height: 100px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-lr;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on opposite sides.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        XXXX
+    </div>
+    <div class="container">
+        <div id="float-right">
+        </div>
+        XXXX
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-014.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-014.html
new file mode 100644 (file)
index 0000000..a4f05ea
--- /dev/null
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<title>CSS Test: shape-outside on floats with a negative margin</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<link rel="match" href="shape-outside-floats-margin-006-ref.html">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 20px;
+    height: 100px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-lr;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 100px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 20%);
+    margin-top: -20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 100px;
+    -webkit-shape-outside: rectangle(0, 80%, 100%, 20%);
+    margin-bottom: -20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on opposite sides.</p>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        XXXX
+    </div>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        XXXX
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-015-expected.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-015-expected.html
new file mode 100644 (file)
index 0000000..7c06309
--- /dev/null
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<title>CSS Reference</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 20px;
+    height: 100px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-lr;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on opposite sides.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        XXXX
+    </div>
+    <div class="container">
+        <div id="float-right">
+        </div>
+        XXXX
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-015.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-015.html
new file mode 100644 (file)
index 0000000..dfdd4ee
--- /dev/null
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<title>CSS Test: shape-outside on floats with a negative margin</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<link rel="match" href="shape-outside-floats-margin-006-ref.html">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 20px;
+    height: 100px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-lr;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 100px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 20%);
+    margin-bottom: -20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 100px;
+    -webkit-shape-outside: rectangle(0, 80%, 100%, 20%);
+    margin-top: -20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on opposite sides.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        XXXX
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        XXXX
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-016-expected.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-016-expected.html
new file mode 100644 (file)
index 0000000..7c06309
--- /dev/null
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<title>CSS Reference</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 20px;
+    height: 100px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-lr;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on opposite sides.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        XXXX
+    </div>
+    <div class="container">
+        <div id="float-right">
+        </div>
+        XXXX
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-016.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-016.html
new file mode 100644 (file)
index 0000000..ab8241f
--- /dev/null
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<title>CSS Test: shape-outside on floats with a negative margin</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<link rel="match" href="shape-outside-floats-margin-006-ref.html">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 20px;
+    height: 100px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-rl;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 100px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 20%);
+    margin-top: -20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 100px;
+    -webkit-shape-outside: rectangle(0, 80%, 100%, 20%);
+    margin-bottom: -20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on opposite sides.</p>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        XXXX
+    </div>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        XXXX
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-017-expected.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-017-expected.html
new file mode 100644 (file)
index 0000000..7c06309
--- /dev/null
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<title>CSS Reference</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 20px;
+    height: 100px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-lr;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on opposite sides.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        XXXX
+    </div>
+    <div class="container">
+        <div id="float-right">
+        </div>
+        XXXX
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-017.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-017.html
new file mode 100644 (file)
index 0000000..7ca1dd3
--- /dev/null
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<title>CSS Test: shape-outside on floats with a negative margin</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<link rel="match" href="shape-outside-floats-margin-006-ref.html">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 20px;
+    height: 100px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-rl;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 100px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 20%);
+    margin-bottom: -20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 100px;
+    -webkit-shape-outside: rectangle(0, 80%, 100%, 20%);
+    margin-top: -20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on opposite sides.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        XXXX
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        XXXX
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-018-expected.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-018-expected.html
new file mode 100644 (file)
index 0000000..72099c1
--- /dev/null
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<title>CSS Reference</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 100px;
+    height: 20px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-lr;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on one end.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        X X X X
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        X X X X
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-018.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-018.html
new file mode 100644 (file)
index 0000000..a3d6046
--- /dev/null
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<title>CSS Test: shape-outside on floats with a negative top margin</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<link rel="match" href="shape-outside-floats-margin-018-ref.html">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 100px;
+    height: 20px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-lr;
+}
+
+#float-left {
+    float: left;
+    width: 40px;
+    height: 20px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 100%);
+    margin-left: -20px;
+}
+
+#float-right {
+    float: right;
+    width: 40px;
+    height: 20px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 100%);
+    margin-left: -20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on one end.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        X X X X
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        X X X X
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-019-expected.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-019-expected.html
new file mode 100644 (file)
index 0000000..72099c1
--- /dev/null
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<title>CSS Reference</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 100px;
+    height: 20px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-lr;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on one end.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        X X X X
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        X X X X
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-019.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-019.html
new file mode 100644 (file)
index 0000000..2922224
--- /dev/null
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<title>CSS Test: shape-outside on floats with a negative top margin</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<link rel="match" href="shape-outside-floats-margin-018-ref.html">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 100px;
+    height: 20px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-lr;
+}
+
+#float-left {
+    float: left;
+    width: 40px;
+    height: 20px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 100%);
+    margin-right: -20px;
+}
+
+#float-right {
+    float: right;
+    width: 40px;
+    height: 20px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 100%);
+    margin-right: -20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on one end.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        X X X X
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        X X X X
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-020-expected.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-020-expected.html
new file mode 100644 (file)
index 0000000..ef122c0
--- /dev/null
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<title>CSS Reference</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 100px;
+    height: 20px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-rl;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on one end.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        X X X X
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        X X X X
+    </div>
+</body>
+
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-020.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-020.html
new file mode 100644 (file)
index 0000000..ac26b7d
--- /dev/null
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<title>CSS Test: shape-outside on floats with a negative top margin</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<link rel="match" href="shape-outside-floats-margin-020-ref.html">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 100px;
+    height: 20px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-rl;
+}
+
+#float-left {
+    float: left;
+    width: 40px;
+    height: 20px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 100%);
+    margin-left: -20px;
+}
+
+#float-right {
+    float: right;
+    width: 40px;
+    height: 20px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 100%);
+    margin-left: -20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on one end.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        X X X X
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        X X X X
+    </div>
+</body>
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-021-expected.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-021-expected.html
new file mode 100644 (file)
index 0000000..ef122c0
--- /dev/null
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<title>CSS Reference</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 100px;
+    height: 20px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-rl;
+}
+
+#float-left {
+    float: left;
+    width: 20px;
+    height: 20px;
+}
+
+#float-right {
+    float: right;
+    width: 20px;
+    height: 20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on one end.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        X X X X
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        X X X X
+    </div>
+</body>
+
diff --git a/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-021.html b/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-021.html
new file mode 100644 (file)
index 0000000..5166d22
--- /dev/null
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<title>CSS Test: shape-outside on floats with a negative top margin</title>
+<link rel="author" title="Adobe" href="http://html.adobe.com/">
+<link rel="author" title="Bem Jones-Bey" href="mailto:bjonesbe@adobe.com">
+<link rel="help" href="http://dev.w3.org/csswg/css-shapes-1/#shape-margin-property">
+<link rel="match" href="shape-outside-floats-margin-020-ref.html">
+<meta name="flags" content="ahem">
+<head>
+<style>
+.container {
+    font: 20px/1 Ahem, sans-serif;
+    line-height: 20px;
+    width: 100px;
+    height: 20px;
+    border: 1px solid black;
+    color: green;
+    display: inline-block;
+    -webkit-writing-mode: vertical-rl;
+}
+
+#float-left {
+    float: left;
+    width: 40px;
+    height: 20px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 100%);
+    margin-right: -20px;
+}
+
+#float-right {
+    float: right;
+    width: 40px;
+    height: 20px;
+    -webkit-shape-outside: rectangle(0, 0, 100%, 100%);
+    margin-right: -20px;
+}
+</style>
+
+<body>
+    <p>This should display two green bars, with white squares on one end.</p>
+    <div class="container">
+        <div id="float-left">
+        </div>
+        X X X X
+    </div>
+    <div class="container" style="text-align: right">
+        <div id="float-right">
+        </div>
+        X X X X
+    </div>
+</body>
index 54ab2e5..6b6406f 100644 (file)
@@ -8,7 +8,7 @@ Then run the Tools/Scripts/import-w3c-tests in Webkit to reimport
 Do NOT modify or remove this file
 
 ------------------------------------------------------------------------
-Last Import: 2013-10-10 09:20
+Last Import: 2013-10-10 15:56
 W3C Mercurial changeset: Not Available
 Test status at time of import: unknown
 ------------------------------------------------------------------------
@@ -76,6 +76,30 @@ List of files:
 /LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-008.html
 /LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-009-expected.html
 /LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-009.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-010-expected.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-010.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-011-expected.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-011.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-012-expected.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-012.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-013-expected.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-013.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-014-expected.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-014.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-015-expected.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-015.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-016-expected.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-016.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-017-expected.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-017.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-018-expected.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-018.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-019-expected.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-019.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-020-expected.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-020.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-021-expected.html
+/LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-margin-021.html
 /LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-polygon-000-expected.html
 /LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-polygon-000.html
 /LayoutTests/csswg/contributors/adobe/submitted/shapes/shape-outside/shape-outside-floats-polygon-001-expected.html