Integrate IETC CSS : flexbox tests
authortomz@codeaurora.org <tomz@codeaurora.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 3 May 2012 21:49:08 +0000 (21:49 +0000)
committertomz@codeaurora.org <tomz@codeaurora.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 3 May 2012 21:49:08 +0000 (21:49 +0000)
https://bugs.webkit.org/show_bug.cgi?id=85210

Patch by Dave Tharp <dtharp@codeaurora.org> on 2012-05-03
Reviewed by Adam Barth.

Added 24 IETC Flexbox tests and reference tests.  Three of these fail and have
new bugs written against them.  Failing tests added to test_expectations.txt
for the various ports.

* ietestcenter/css3/flexbox/flexbox-align-baseline-001-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-align-baseline-001.htm: Added.
* ietestcenter/css3/flexbox/flexbox-align-center-001-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-align-center-001.htm: Added.
* ietestcenter/css3/flexbox/flexbox-align-center-002-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-align-center-002.htm: Added.
* ietestcenter/css3/flexbox/flexbox-align-end-001-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-align-end-001.htm: Added.
* ietestcenter/css3/flexbox/flexbox-align-start-001-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-align-start-001.htm: Added.
* ietestcenter/css3/flexbox/flexbox-align-stretch-001-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-align-stretch-001.htm: Added.
* ietestcenter/css3/flexbox/flexbox-direction-001-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-direction-001.htm: Added.
* ietestcenter/css3/flexbox/flexbox-flex-001-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-flex-001.htm: Added.
* ietestcenter/css3/flexbox/flexbox-flex-002-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-flex-002.htm: Added.
* ietestcenter/css3/flexbox/flexbox-flex-003-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-flex-003.htm: Added.
* ietestcenter/css3/flexbox/flexbox-flex-004-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-flex-004.htm: Added.
* ietestcenter/css3/flexbox/flexbox-flex-005-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-flex-005.htm: Added.
* ietestcenter/css3/flexbox/flexbox-groups-001-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-groups-001.htm: Added.
* ietestcenter/css3/flexbox/flexbox-groups-002-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-groups-002.htm: Added.
* ietestcenter/css3/flexbox/flexbox-groups-003-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-groups-003.htm: Added.
* ietestcenter/css3/flexbox/flexbox-groups-004-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-groups-004.htm: Added.
* ietestcenter/css3/flexbox/flexbox-layout-001-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-layout-001.htm: Added.
* ietestcenter/css3/flexbox/flexbox-layout-002-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-layout-002.htm: Added.
* ietestcenter/css3/flexbox/flexbox-layout-003-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-layout-003.htm: Added.
* ietestcenter/css3/flexbox/flexbox-ordinal-group-001-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-ordinal-group-001.htm: Added.
* ietestcenter/css3/flexbox/flexbox-pack-center-001-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-pack-center-001.htm: Added.
* ietestcenter/css3/flexbox/flexbox-pack-end-001-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-pack-end-001.htm: Added.
* ietestcenter/css3/flexbox/flexbox-pack-justify-001-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-pack-justify-001.htm: Added.
* ietestcenter/css3/flexbox/flexbox-pack-start-001-expected.htm: Added.
* ietestcenter/css3/flexbox/flexbox-pack-start-001.htm: Added.
* platform/chromium/test_expectations.txt:
* platform/efl/test_expectations.txt:
* platform/gtk/test_expectations.txt:
* platform/mac/test_expectations.txt:
* platform/qt/test_expectations.txt:

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

54 files changed:
LayoutTests/ChangeLog
LayoutTests/ietestcenter/css3/flexbox/flexbox-align-baseline-001-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-align-baseline-001.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-align-center-001-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-align-center-001.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-align-center-002-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-align-center-002.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-align-end-001-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-align-end-001.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-align-start-001-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-align-start-001.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-align-stretch-001-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-align-stretch-001.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-direction-001-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-direction-001.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-001-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-001.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-002-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-002.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-003-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-003.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-004-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-004.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-005-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-005.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-001-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-001.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-002-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-002.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-003-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-003.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-004-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-004.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-001-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-001.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-002-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-002.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-003-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-003.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-ordinal-group-001-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-ordinal-group-001.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-center-001-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-center-001.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-end-001-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-end-001.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-justify-001-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-justify-001.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-start-001-expected.htm [new file with mode: 0644]
LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-start-001.htm [new file with mode: 0644]
LayoutTests/platform/chromium/test_expectations.txt
LayoutTests/platform/efl/test_expectations.txt
LayoutTests/platform/gtk/test_expectations.txt
LayoutTests/platform/mac/test_expectations.txt
LayoutTests/platform/qt/test_expectations.txt

index c7361d2..6e0f27b 100644 (file)
@@ -1,3 +1,68 @@
+2012-05-03  Dave Tharp  <dtharp@codeaurora.org>
+
+        Integrate IETC CSS : flexbox tests
+        https://bugs.webkit.org/show_bug.cgi?id=85210
+
+        Reviewed by Adam Barth.
+
+        Added 24 IETC Flexbox tests and reference tests.  Three of these fail and have 
+        new bugs written against them.  Failing tests added to test_expectations.txt 
+        for the various ports.
+
+        * ietestcenter/css3/flexbox/flexbox-align-baseline-001-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-align-baseline-001.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-align-center-001-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-align-center-001.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-align-center-002-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-align-center-002.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-align-end-001-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-align-end-001.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-align-start-001-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-align-start-001.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-align-stretch-001-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-align-stretch-001.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-direction-001-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-direction-001.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-flex-001-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-flex-001.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-flex-002-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-flex-002.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-flex-003-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-flex-003.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-flex-004-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-flex-004.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-flex-005-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-flex-005.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-groups-001-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-groups-001.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-groups-002-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-groups-002.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-groups-003-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-groups-003.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-groups-004-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-groups-004.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-layout-001-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-layout-001.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-layout-002-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-layout-002.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-layout-003-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-layout-003.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-ordinal-group-001-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-ordinal-group-001.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-pack-center-001-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-pack-center-001.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-pack-end-001-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-pack-end-001.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-pack-justify-001-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-pack-justify-001.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-pack-start-001-expected.htm: Added.
+        * ietestcenter/css3/flexbox/flexbox-pack-start-001.htm: Added.
+        * platform/chromium/test_expectations.txt:
+        * platform/efl/test_expectations.txt:
+        * platform/gtk/test_expectations.txt:
+        * platform/mac/test_expectations.txt:
+        * platform/qt/test_expectations.txt:
+
 2012-05-03  Emil A Eklund  <eae@chromium.org>
 
         Unreviewed chromium test expectations update, mark a column test as failing due to overflow.
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-baseline-001-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-baseline-001-expected.htm
new file mode 100644 (file)
index 0000000..923e667
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-align baseline will line up the flexbox items vertically with the bottom extent of the tallest (in horizontal) - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            div
+            {
+                background: green;
+                width: 300px;
+                height: 200px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-baseline-001.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-baseline-001.htm
new file mode 100644 (file)
index 0000000..bf5b1d5
--- /dev/null
@@ -0,0 +1,79 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-align baseline will line up the flexbox items vertically with the bottom extent of the tallest (in horizontal)</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="assert" content="box-align:center will align bottoms of child boxes with tallest child"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                -ms-box-align: baseline;
+                -moz-box-align: baseline;
+                -o-box-align: baseline;
+                -webkit-box-align: baseline;
+                box-align: baseline;
+                background: url('../support/flexbox_300x50_100_80_baseline_red.png') top left no-repeat green;
+                width: 300px;
+                height: 200px;
+            }
+            .child
+            {
+                width: 100px;
+                background: green;
+            }
+            .hundred
+            {
+                height:100px;
+            }
+            .eighty
+            {
+                height:80px;
+            }
+            .fifty
+            {
+                height:50px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child fifty"></div>
+            <div class="child hundred"></div>
+            <div class="child eighty"></div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-center-001-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-center-001-expected.htm
new file mode 100644 (file)
index 0000000..178fe88
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-align center places flex items vertically centered in the flexbox (in horizontal) - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            div
+            {
+                background: green;
+                width: 300px;
+                height: 200px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-center-001.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-center-001.htm
new file mode 100644 (file)
index 0000000..7bdbaa8
--- /dev/null
@@ -0,0 +1,69 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-align center places flex items vertically centered in the flexbox (in horizontal)</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="box-align:end will align centers of child boxes with the vertical center of the flexbox"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                -ms-box-align: center;
+                -moz-box-align: center;
+                -o-box-align: center;
+                -webkit-box-align: center;
+                box-align: center;
+                background: url('../support/flexbox_300x150_100red.png') top left green;
+                width: 300px;
+                height: 200px;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child"></div>
+            <div class="child"></div>
+            <div class="child"></div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-center-002-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-center-002-expected.htm
new file mode 100644 (file)
index 0000000..14a6ece
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-align center will center the flexbox items vertically(in horizontal) - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            div
+            {
+                background: green;
+                width: 300px;
+                height: 200px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-center-002.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-center-002.htm
new file mode 100644 (file)
index 0000000..06888e0
--- /dev/null
@@ -0,0 +1,80 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-align center will center the flexbox items vertically(in horizontal)</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="box-align:center will align centers of child boxes with the flexbox's center vertically"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                -ms-box-align: center;
+                -moz-box-align: center;
+                -o-box-align: center;
+                -webkit-box-align: center;
+                box-align: center;
+                background: url('../support/flexbox_300x50_100_80_red.png') top left green;
+                width: 300px;
+                height: 200px;
+            }
+            .child
+            {
+                width: 100px;
+                background: green;
+            }
+            .hundred
+            {
+                height:100px;
+            }
+            .eighty
+            {
+                height:80px;
+            }
+            .fifty
+            {
+                height:50px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child fifty"></div>
+            <div class="child hundred"></div>
+            <div class="child eighty"></div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-end-001-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-end-001-expected.htm
new file mode 100644 (file)
index 0000000..726c875
--- /dev/null
@@ -0,0 +1,42 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-align end places flex items at the bottom of the flexbox (in horizontal) - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            .box
+            {
+                background: green;
+                width: 300px;
+                height: 200px;
+                z-index: -1;
+                position: relative;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+                position: absolute;
+                top: 100px;
+            }
+            .sub_b
+            {
+                left:100px;
+            }
+            .sub_c
+            {
+                left: 200px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child">Box1</div>
+            <div class="child sub_b">Box2</div>
+            <div class="child sub_c">Box3</div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-end-001.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-end-001.htm
new file mode 100644 (file)
index 0000000..74171ee
--- /dev/null
@@ -0,0 +1,69 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-align end places flex items at the bottom of the flexbox (in horizontal)</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="box-align:end will align child boxes with the ending of the flexbox"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                -ms-box-align: end;
+                -moz-box-align: end;
+                -o-box-align: end;
+                -webkit-box-align: end;
+                box-align: end;
+                background: url('../support/flexbox_100x100_green.png') top left repeat-x red;
+                width: 300px;
+                height: 200px;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child">Box1</div>
+            <div class="child">Box2</div>
+            <div class="child">Box3</div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-start-001-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-start-001-expected.htm
new file mode 100644 (file)
index 0000000..b72efe8
--- /dev/null
@@ -0,0 +1,40 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-align start places flex items at the top of the flexbox (in horizontal) - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            .box
+            {
+                background: green;
+                width: 300px;
+                height: 200px;
+                position: relative;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+                position: absolute;
+            }
+            .sub_b
+            {
+                left: 100px;
+            }
+            .sub_c
+            {
+                left: 200px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child">Box1</div>
+            <div class="child sub_b">Box2</div>
+            <div class="child sub_c">Box3</div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-start-001.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-start-001.htm
new file mode 100644 (file)
index 0000000..9c18e4c
--- /dev/null
@@ -0,0 +1,69 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-align start places flex items at the top of the flexbox (in horizontal)</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="box-align:start will align child boxes with the beginning of the flexbox"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                -ms-box-align: start;
+                -moz-box-align: start;
+                -o-box-align: start;
+                -webkit-box-align: start;
+                box-align: start;
+                background: url('../support/flexbox_100x100_green.png') bottom left repeat-x red;
+                width: 300px;
+                height: 200px;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child">Box1</div>
+            <div class="child">Box2</div>
+            <div class="child">Box3</div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-stretch-001-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-stretch-001-expected.htm
new file mode 100644 (file)
index 0000000..fd38467
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-align stretch forces flex items to fill the flexbox vertically(in horizontal) - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            div
+            {
+                background: green;
+                width: 300px;
+                height: 200px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-stretch-001.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-align-stretch-001.htm
new file mode 100644 (file)
index 0000000..7aa7af9
--- /dev/null
@@ -0,0 +1,69 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-align stretch forces flex items to fill the flexbox vertically(in horizontal)</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="" />
+        <meta name="assert" content="box-align:stretch will force child boxes to fill the flexbox vertically"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                -ms-box-align: stretch;
+                -moz-box-align: stretch;
+                -o-box-align: stretch;
+                -webkit-box-align: stretch;
+                box-align: stretch;
+                background: red;
+                width: 300px;
+                height: 200px;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child"></div>
+            <div class="child"></div>
+            <div class="child"></div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-direction-001-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-direction-001-expected.htm
new file mode 100644 (file)
index 0000000..c1a19ef
--- /dev/null
@@ -0,0 +1,69 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-Direction property is correct - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            .parent
+            {
+                position: relative;
+            }
+            .table_div
+            {
+                position: absolute;
+                left: -10px;
+            }
+
+            table
+            {
+                font-size:large;
+                border-collapse: separate;
+                border-spacing: 20px 0px;
+            }
+            td
+            {
+                border:thin solid black;
+                padding:0 10px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>Test passes if four rows of numbers (1,2,3) are read in increasing numerical order left to right.</p>
+        <div class="parent">
+            <div class="table_div">
+                <table>
+                    <tr>
+                        <td>1</td>
+                        <td>2</td>
+                        <td>3</td>
+                    </tr>
+                </table>
+                <br />
+                <table>
+                    <tr>
+                        <td>1</td>
+                        <td>2</td>
+                        <td>3</td>
+                    </tr>
+                </table>
+                <br />
+                <table>
+                    <tr>
+                        <td>1</td>
+                        <td>2</td>
+                        <td>3</td>
+                    </tr>
+                </table>
+                <br />
+                <table>
+                    <tr>
+                        <td>1</td>
+                        <td>2</td>
+                        <td>3</td>
+                    </tr>
+                </table>
+            </div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-direction-001.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-direction-001.htm
new file mode 100644 (file)
index 0000000..7138201
--- /dev/null
@@ -0,0 +1,119 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-Direction property is correct</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="" />
+        <meta name="assert" content="box-direction property [normal, reverse, inherit] is correct in simple cases"/>
+        <style type="text/css">
+            .parent
+            {
+                float:left;  /*to shrink to fit*/
+            }
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+            }
+            .child
+            {
+                border:thin solid black;
+                margin: 0 10px;
+                padding:0 10px;
+                font-size:large;
+                -ms-box-direction:normal;
+                -webkit-box-direction:normal;
+                -moz-box-direction:normal;
+                -o-box-direction:normal;
+                box-direction:normal;
+            }
+            .reverse
+            {
+                -ms-box-direction:reverse;
+                -webkit-box-direction:reverse;
+                -moz-box-direction:reverse;
+                -o-box-direction:reverse;
+                box-direction:reverse;
+            }
+            .inherit
+            {
+                -ms-box-direction:inherit;
+                -webkit-box-direction:inherit;
+                -moz-box-direction:inherit;
+                -o-box-direction:inherit;
+                box-direction:inherit;
+            }
+            .lr
+            {
+                direction:ltr;
+            }
+            .rl
+            {
+                direction:rtl;
+            }
+        </style>
+    </head>
+    <body>
+        <p>Test passes if four rows of numbers (1,2,3) are read in increasing numerical order left to right.</p>
+        <div class="parent">
+            <div class="box">
+                <div class="child">1</div>
+                <div class="child">2</div>
+                <div class="child">3</div>
+            </div>
+            <br />
+            <div class="box reverse">
+                <div class="child">3</div>
+                <div class="child">2</div>
+                <div class="child">1</div>
+            </div>
+            <br />
+            <div class="lr">
+                <div class="box inherit">
+                    <div class="child">1</div>
+                    <div class="child">2</div>
+                    <div class="child">3</div>
+                </div>
+            </div>
+            <br />
+            <div class="rl">
+                <div class="box inherit">
+                    <div class="child">3</div>
+                    <div class="child">2</div>
+                    <div class="child">1</div>
+                </div>
+            </div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-001-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-001-expected.htm
new file mode 100644 (file)
index 0000000..5ea6398
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Child boxes with box-flex:0 do not expand - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            div
+            {
+                background: green;
+                width: 300px;
+                height: 100px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-001.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-001.htm
new file mode 100644 (file)
index 0000000..546ae29
--- /dev/null
@@ -0,0 +1,67 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Child boxes with box-flex:0 do not expand</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="box-flex:0 boxes should not flex to take any extra space"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                background: url('../support/flexbox_100x100_red.png') top left no-repeat green;
+                width: 300px;
+                height: 100px;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: url('../support/flexbox_100x100g_red.png') top left no-repeat red;
+                -ms-box-flex: 0;
+                -moz-box-flex: 0;
+                -o-box-flex: 0;
+                -webkit-box-flex: 0;
+                box-flex: 0;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child"></div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-002-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-002-expected.htm
new file mode 100644 (file)
index 0000000..c2a1856
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Child boxes with box-flex:1 should expand to fill the flexbox - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            div
+            {
+                background: green;
+                width: 300px;
+                height: 100px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-002.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-002.htm
new file mode 100644 (file)
index 0000000..fecc0af
--- /dev/null
@@ -0,0 +1,67 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Child boxes with box-flex:1 should expand to fill the flexbox</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="" />
+        <meta name="assert" content="box-flex:1 should flex the box to fill all available space"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                background: red;
+                width: 300px;
+                height: 100px;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+                -ms-box-flex: 1;
+                -moz-box-flex: 1;
+                -o-box-flex: 1;
+                -webkit-box-flex: 1;
+                box-flex: 1;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child"></div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-003-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-003-expected.htm
new file mode 100644 (file)
index 0000000..f2f986c
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Child boxes with box-flex:1 should expand to fill the flexbox when siblings do not flex - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            div
+            {
+                background: green;
+                width: 300px;
+                height: 100px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-003.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-003.htm
new file mode 100644 (file)
index 0000000..dfa259c
--- /dev/null
@@ -0,0 +1,80 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Child boxes with box-flex:1 should expand to fill the flexbox when siblings do not flex</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="box-flex:1 should flex the box to fill all available space while box-flex:0 does not"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                background: red;
+                width: 300px;
+                height: 100px;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+            }
+            .big
+            {
+                -ms-box-flex: 1;
+                -moz-box-flex: 1;
+                -o-box-flex: 1;
+                -webkit-box-flex: 1;
+                box-flex: 1;
+                background: url('../support/flexbox_200x100g_red.png') top left no-repeat red;
+            }
+            .small
+            {
+                -ms-box-flex: 0;
+                -moz-box-flex: 0;
+                -o-box-flex: 0;
+                -webkit-box-flex: 0;
+                box-flex: 0;
+                background: url('../support/flexbox_100x100g_red.png') top left no-repeat red;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child big"></div>
+            <div class="child small"></div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-004-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-004-expected.htm
new file mode 100644 (file)
index 0000000..880cc7e
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Child boxes with box-flex:1 should split with evenly flexing siblings - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            div
+            {
+                background: green;
+                width: 400px;
+                height: 100px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-004.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-004.htm
new file mode 100644 (file)
index 0000000..6a8b160
--- /dev/null
@@ -0,0 +1,68 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Child boxes with box-flex:1 should split with evenly flexing siblings</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="all items marked box-flex:1 should flex the box to fill all available space evenly"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                background: red;
+                width: 400px;
+                height: 100px;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                -ms-box-flex: 1;
+                -moz-box-flex: 1;
+                -o-box-flex: 1;
+                -webkit-box-flex: 1;
+                box-flex: 1;
+                background: url('../support/flexbox_200x100g_red.png') top left no-repeat red;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child"></div>
+            <div class="child"></div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-005-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-005-expected.htm
new file mode 100644 (file)
index 0000000..04c42c7
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Child boxes with box-flex:1 should split with evenly flexing siblings (check rounding) - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            div
+            {
+                background: green;
+                width: 400px;
+                height: 100px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-005.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-flex-005.htm
new file mode 100644 (file)
index 0000000..2be897a
--- /dev/null
@@ -0,0 +1,74 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Child boxes with box-flex:1 should split with evenly flexing siblings (check rounding)</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="" />
+        <meta name="assert" content="all items marked box-flex:1 should flex the box to fill all available space evenly (checking rounding)"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                background: red;
+                width: 400px;
+                height: 100px;
+            }
+            .child
+            {
+                height: 100px;
+                -ms-box-flex: 1;
+                -moz-box-flex: 1;
+                -o-box-flex: 1;
+                -webkit-box-flex: 1;
+                box-flex: 1;
+                background: green;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child"></div>
+            <div class="child"></div>
+            <div class="child"></div>
+            <div class="child"></div>
+            <div class="child"></div>
+            <div class="child"></div>
+            <div class="child"></div>
+            <div class="child"></div>
+            <div class="child"></div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-001-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-001-expected.htm
new file mode 100644 (file)
index 0000000..510c4f1
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Flex groups with lower numbers flex to fill space first - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            div
+            {
+                background: green;
+                width: 300px;
+                height: 100px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-001.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-001.htm
new file mode 100644 (file)
index 0000000..dadc70f
--- /dev/null
@@ -0,0 +1,86 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Flex groups with lower numbers flex to fill space first</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="box-flex-groups with lower integer values flex before higher groups are allowed to take space"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                background: red;
+                width: 300px;
+                height: 100px;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                -ms-box-flex: 1;
+                -moz-box-flex: 1;
+                -o-box-flex: 1;
+                -webkit-box-flex: 1;
+                box-flex: 1;
+                background: green;
+            }
+            .one
+            {
+                -ms-box-flex-group: 1;
+                -moz-box-flex-group: 1;
+                -o-box-flex-group: 1;
+                -webkit-box-flex-group: 1;
+                box-flex-group: 1;
+                background: url('../support/flexbox_200x100g_red.png') top left no-repeat red;
+            }
+            .two
+            {
+                -ms-box-flex-group: 2;
+                -moz-box-flex-group: 2;
+                -o-box-flex-group: 2;
+                -webkit-box-flex-group: 2;
+                box-flex-group: 2;
+                background: url('../support/flexbox_100x100g_red.png') top left no-repeat red;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child one"></div>
+            <div class="child two"></div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-002-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-002-expected.htm
new file mode 100644 (file)
index 0000000..c1b30ca
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Flex groups with lower numbers flex to fill space first (checking zero) - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            div
+            {
+                background: green;
+                width: 300px;
+                height: 100px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-002.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-002.htm
new file mode 100644 (file)
index 0000000..c4bdadd
--- /dev/null
@@ -0,0 +1,78 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Flex groups with lower numbers flex to fill space first (checking zero)</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="box-flex-groups with lower integer values flex before higher groups are allowed to take space (zero is valid)"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                background: red;
+                width: 300px;
+                height: 100px;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                -ms-box-flex: 1;
+                -moz-box-flex: 1;
+                -o-box-flex: 1;
+                -webkit-box-flex: 1;
+                box-flex: 1;
+                background: green;
+                background: url('../support/flexbox_100x100g_red.png') top left no-repeat red;
+            }
+            .zero
+            {
+                -ms-box-flex-group: 0;
+                -moz-box-flex-group: 0;
+                -o-box-flex-group: 0;
+                -webkit-box-flex-group: 0;
+                box-flex-group: 0;
+                background: url('../support/flexbox_200x100g_red.png') top left no-repeat red;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child one"></div>
+            <div class="child zero"></div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-003-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-003-expected.htm
new file mode 100644 (file)
index 0000000..8c1d4e9
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Flex groups with equal numbers flex to fill space evenly - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            div
+            {
+                background: green;
+                width: 200px;
+                height: 100px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-003.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-003.htm
new file mode 100644 (file)
index 0000000..648e92e
--- /dev/null
@@ -0,0 +1,74 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Flex groups with equal numbers flex to fill space evenly</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="box-flex-groups with equal integer values flex evenly"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                background: red;
+                width: 200px;
+                height: 100px;
+            }
+            .child
+            {
+                width: 50px;
+                height: 100px;
+                -ms-box-flex: 1;
+                -moz-box-flex: 1;
+                -o-box-flex: 1;
+                -webkit-box-flex: 1;
+                box-flex: 1;
+
+                -ms-box-flex-group: 2;
+                -moz-box-flex-group: 2;
+                -o-box-flex-group: 2;
+                -webkit-box-flex-group: 2;
+                box-flex-group: 2;
+                background: url('../support/flexbox_100x100g_red.png') top left no-repeat red;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child"></div>
+            <div class="child"></div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-004-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-004-expected.htm
new file mode 100644 (file)
index 0000000..6df94a6
--- /dev/null
@@ -0,0 +1,21 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Flex groups can max out and share additional space with others - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            div
+            {
+                background: green;
+                width: 300px;
+                height: 100px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-004.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-groups-004.htm
new file mode 100644 (file)
index 0000000..571a301
--- /dev/null
@@ -0,0 +1,87 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Flex groups can max out and share additional space with others</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="box-flex-groups can reach max size and share additional space with other groups"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                background: red;
+                width: 300px;
+                height: 100px;
+            }
+            .child
+            {
+                width: 50px;
+                height: 100px;
+                -ms-box-flex: 1;
+                -moz-box-flex: 1;
+                -o-box-flex: 1;
+                -webkit-box-flex: 1;
+                box-flex: 1;
+                background: green;
+            }
+            .one
+            {
+                max-width: 200px;
+                -ms-box-flex-group: 1;
+                -moz-box-flex-group: 1;
+                -o-box-flex-group: 1;
+                -webkit-box-flex-group: 1;
+                box-flex-group: 1;
+                background: url('../support/flexbox_200x100g_red.png') top left no-repeat red;
+            }
+            .two
+            {
+                -ms-box-flex-group: 2;
+                -moz-box-flex-group: 2;
+                -o-box-flex-group: 2;
+                -webkit-box-flex-group: 2;
+                box-flex-group: 2;
+                background: url('../support/flexbox_100x100g_red.png') top left no-repeat red;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child one"></div>
+            <div class="child two"></div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-001-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-001-expected.htm
new file mode 100644 (file)
index 0000000..1cea257
--- /dev/null
@@ -0,0 +1,40 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Flexboxes have block layout - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            table
+            {
+                border: 0px;
+                border-collapse:collapse;
+                border-spacing:0px 0px;
+                background: green;
+            }
+            td
+            {
+                width:50px;
+                height:50px;
+                vertical-align:text-top;
+                padding: 0px;
+            }
+        </style>
+    </head>
+
+    <body>
+        <p>Test passes if there is no red visible on the page.</p>
+        <div>
+            <table>
+                <tr>
+                    <td>top left</td>
+                    <td>top right</td>
+                </tr>
+                <tr>
+                    <td>bottom left</td>
+                    <td>bottom right</td>
+                </tr>
+            </table>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-001.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-001.htm
new file mode 100644 (file)
index 0000000..fa1c7f1
--- /dev/null
@@ -0,0 +1,72 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Flexboxes have block layout</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="Flexboxes and child boxes are block and inline-block layout (respectively)"/>
+        <style type="text/css">
+            .parent
+            {
+                float:left; /*to shrink to fit*/
+                background: url('../support/flexbox_100x100g_red.png') top left no-repeat red;
+            }
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+            }
+            .child
+            {
+                width:50px;
+                height:50px;
+            }
+        </style>
+    </head>
+
+    <body>
+        <p>Test passes if there is no red visible on the page.</p>
+
+        <div class="parent">
+            <div class="box">
+                <div class="child">top left</div>
+                <div class="child">top right</div>
+            </div>
+            <div class="box">
+                <div class="child">bottom left</div>
+                <div class="child">bottom right</div>
+            </div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-002-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-002-expected.htm
new file mode 100644 (file)
index 0000000..7a1cecb
--- /dev/null
@@ -0,0 +1,35 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Flexbox must shrink to fit child content - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            table
+            {
+                border: 0px;
+                border-collapse:collapse;
+                border-spacing:0px 0px;
+                background: green;
+            }
+            td
+            {
+                width:100px;
+                vertical-align:text-top;
+                padding: 0px;
+            }
+
+        </style>
+    </head>
+    <body>
+        <p>Test passes if there is no red visible on the page.</p>
+        <div>
+            <table>
+                <tr>
+                    <td>100px wide child</td>
+                    <td>100px wide child</td>
+                </tr>
+            </table>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-002.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-002.htm
new file mode 100644 (file)
index 0000000..cd4d93b
--- /dev/null
@@ -0,0 +1,61 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Flexbox must shrink to fit child content</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="A flexbox item 'shrinkwraps' its contents by default (when its ‘width’ or ‘height’ properties are ‘auto’)."/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                background: red;
+            }
+            .child
+            {
+                background: green;
+                width:100px;
+                border: none;
+            }
+        </style>
+    </head>
+    <body>
+        <p>Test passes if there is no red visible on the page.</p>
+        <div class="box">
+            <div class="child">100px wide child</div>
+            <div class="child">100px wide child</div>
+        </div>
+    </body>
+</html>
\ No newline at end of file
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-003-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-003-expected.htm
new file mode 100644 (file)
index 0000000..88c8fb2
--- /dev/null
@@ -0,0 +1,39 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Flexbox does not shrink to fit children when width and height are specified. - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/css3-flexbox/"/>
+        <style type="text/css">
+            .parent
+            {
+                background: green;
+                width:500px;
+                height:500px;
+                position: relative;
+            }
+            .childa
+            {
+                width:100px;
+                height:100px;
+                background: green;
+                position: absolute;
+            }
+            .childb
+            {
+                width:100px;
+                height:100px;
+                background: green;
+                position: absolute;
+                left: 100px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>Test passes if there is no red visible on the page.</p>
+        <div class="parent">
+            <div class="childa">parent is 300x200px</div>
+            <div class="childb">two children are 100x100px</div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-003.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-layout-003.htm
new file mode 100644 (file)
index 0000000..cbb5b6d
--- /dev/null
@@ -0,0 +1,71 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Flexbox does not shrink to fit children when width and height are specified.</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/css3-flexbox/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="Flexbox does not shrink to preferred child size when its width and height are specified."/>
+        <style type="text/css">
+            .parent
+            {
+                background: url('../support/flexbox_300x200_red.png') no-repeat green;
+                width:500px;
+                height:500px;
+            }
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                width:300px;
+                height:200px;
+                background: url('../support/flexbox_200x100_red.png') no-repeat green;
+            }
+            .child
+            {
+                width:100px;
+                height:100px;
+                background: url('../support/flexbox_100x100_green.png') no-repeat red;
+            }
+        </style>
+    </head>
+    <body>
+        <p>Test passes if there is no red visible on the page.</p>
+        <div class="parent">
+            <div class="box">
+                <div class="child">parent is 300x200px</div>
+                <div class="child">two children are 100x100px</div>
+            </div>
+        </div>
+    </body>
+</html>
\ No newline at end of file
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-ordinal-group-001-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-ordinal-group-001-expected.htm
new file mode 100644 (file)
index 0000000..7ecf3ed
--- /dev/null
@@ -0,0 +1,45 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box ordinal group default and value of zero - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            .parent
+            {
+                position: relative;
+            }
+            .table_div
+            {
+                position: absolute;
+                left: -10px;
+            }
+
+            table
+            {
+                font-size:large;
+                border-collapse: separate;
+                border-spacing: 20px 0px;
+            }
+            td
+            {
+                border:thin solid black;
+                padding:0 10px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>Test passes if numbers (1,2,3) are read in increasing numerical order left to right.</p>
+        <div class="parent">
+            <div class="table_div">
+                <table>
+                    <tr>
+                        <td>1</td>
+                        <td>2</td>
+                        <td>3</td>
+                    </tr>
+                </table>
+            </div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-ordinal-group-001.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-ordinal-group-001.htm
new file mode 100644 (file)
index 0000000..8adb65a
--- /dev/null
@@ -0,0 +1,78 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box ordinal group default and value of zero</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="" />
+        <meta name="assert" content="box-ordinal-groups have 1 as a default value and can use 0."/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+            }
+            .child
+            {
+                border: solid thin black;
+                margin: 0 10px;
+                padding: 0 10px;
+                font-size: large;
+            }
+            .zero
+            {
+                -ms-box-ordinal-group: 0;
+                -moz-box-ordinal-group: 0;
+                -o-box-ordinal-group: 0;
+                -webkit-box-ordinal-group: 0;
+                box-ordinal-group: 0;
+            }
+            .two
+            {
+                -ms-box-ordinal-group: 2;
+                -moz-box-ordinal-group: 2;
+                -o-box-ordinal-group: 2;
+                -webkit-box-ordinal-group: 2;
+                box-ordinal-group: 2;
+            }
+        </style>
+    </head>
+    <body>
+        <p>Test passes if numbers (1,2,3) are read in increasing numerical order left to right.</p>
+        <div class="box">
+            <div class="child two">3</div>
+            <div class="child zero">1</div>
+            <div class="child">2</div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-center-001-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-center-001-expected.htm
new file mode 100644 (file)
index 0000000..67e9bdb
--- /dev/null
@@ -0,0 +1,44 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-pack center places flexbox items in the middle (in horizontal) - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            .box
+            {
+                background: green;
+                width: 400px;
+                height: 100px;
+                position: relative;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+                position: absolute;
+            }
+            .c1
+            {
+                left: 50px;
+            }
+            .c2
+            {
+                left: 150px;
+            }
+            .c3
+            {
+                left: 250px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child c1">Box1</div>
+            <div class="child c2">Box2</div>
+            <div class="child c3">Box3</div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-center-001.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-center-001.htm
new file mode 100644 (file)
index 0000000..513702e
--- /dev/null
@@ -0,0 +1,69 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-pack center places flexbox items in the middle (in horizontal)</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="box-pack: start pushes the child boxes into the center"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                -ms-box-pack: center;
+                -moz-box-pack: center;
+                -o-box-pack: center;
+                -webkit-box-pack: center;
+                box-pack: center;
+                background: url('../support/flexbox_300x100_red.png') top center no-repeat green;
+                width: 400px;
+                height: 100px;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child">Box1</div>
+            <div class="child">Box2</div>
+            <div class="child">Box3</div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-end-001-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-end-001-expected.htm
new file mode 100644 (file)
index 0000000..801a369
--- /dev/null
@@ -0,0 +1,44 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-pack end places flexbox items at the right side (in horizonatal) - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            .box
+            {
+                background: green;
+                width: 400px;
+                height: 100px;
+                position: relative;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+                position: absolute;
+            }
+            .c1
+            {
+                left: 100px;
+            }
+            .c2
+            {
+                left: 200px;
+            }
+            .c3
+            {
+                left: 300px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child c1">Box1</div>
+            <div class="child c2">Box2</div>
+            <div class="child c3">Box3</div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-end-001.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-end-001.htm
new file mode 100644 (file)
index 0000000..0075683
--- /dev/null
@@ -0,0 +1,69 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-pack end places flexbox items at the right side (in horizonatal)</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="box-pack: end pushes the child boxes all the way to the right"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                -ms-box-pack: end;
+                -moz-box-pack: end;
+                -o-box-pack: end;
+                -webkit-box-pack: end;
+                box-pack: end;
+                background: url('../support/flexbox_100x100g_red.png') top left no-repeat red;
+                width: 400px;
+                height: 100px;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child">Box1</div>
+            <div class="child">Box2</div>
+            <div class="child">Box3</div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-justify-001-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-justify-001-expected.htm
new file mode 100644 (file)
index 0000000..eb43f53
--- /dev/null
@@ -0,0 +1,44 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-pack justify spaces flexbox items evenly (in horizontal) - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            .box
+            {
+                background: green;
+                width: 400px;
+                height: 100px;
+                position: relative;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+                position: absolute;
+            }
+            .c1
+            {
+                left: 0px;
+            }
+            .c2
+            {
+                left: 150px;
+            }
+            .c3
+            {
+                left: 300px;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child c1">Box1</div>
+            <div class="child c2">Box2</div>
+            <div class="child c3">Box3</div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-justify-001.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-justify-001.htm
new file mode 100644 (file)
index 0000000..b6acf52
--- /dev/null
@@ -0,0 +1,69 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-pack justify spaces flexbox items evenly (in horizontal)</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="box-pack: justify spaces children evenly"/>
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                -ms-box-pack: justify;
+                -moz-box-pack: justify;
+                -o-box-pack: justify;
+                -webkit-box-pack: justify;
+                box-pack: justify;
+                background: url('../support/flexbox_100r_50g_100r_50g_100g.png') top left no-repeat red;
+                width: 400px;
+                height: 100px;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child">Box1</div>
+            <div class="child">Box2</div>
+            <div class="child">Box3</div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-start-001-expected.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-start-001-expected.htm
new file mode 100644 (file)
index 0000000..3755a5a
--- /dev/null
@@ -0,0 +1,45 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-pack start places flexbox items at the left side (in horizontal) - Reference </title>
+        <link rel="author" title="Codeaurora" href="http://www.codeaurora.org/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <style type="text/css">
+            .box
+            {
+                background: green;
+                width: 400px;
+                height: 100px;
+                position: relative;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+                position: absolute;
+            }
+            .c1
+            {
+                left: 0px;
+            }
+            .c2
+            {
+                left: 100px;
+            }
+            .c3
+            {
+                left: 200px;
+            }
+
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child c1">Box1</div>
+            <div class="child c2">Box2</div>
+            <div class="child c3">Box3</div>
+        </div>
+    </body>
+</html>
diff --git a/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-start-001.htm b/LayoutTests/ietestcenter/css3/flexbox/flexbox-pack-start-001.htm
new file mode 100644 (file)
index 0000000..df1601d
--- /dev/null
@@ -0,0 +1,69 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<!--
+ Internet Explorer Test Pages Copyright © 2012 Microsoft Corporation. All rights reserved.
+
+ Redistribution and use in source and binary forms, with or without modification,
+ are permitted provided that the following conditions are met:
+
+ Redistributions of source code must retain the above copyright notice, this list of
+ conditions and the following disclaimer.
+
+ Redistributions in binary form must reproduce the above copyright notice, this list of
+ conditions and the following disclaimer in the documentation and/or other materials
+ provided with the distribution.
+
+ Neither the name of the Microsoft Corporation nor the names of its contributors may be
+ used to endorse or promote products derived from this software without specific prior
+ written permission.
+
+ THIS SOFTWARE IS PROVIDED BY MICROSOFT CORPORATION "AS IS" AND ANY EXPRESS OR IMPLIED
+ WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
+ FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL MICROSOFT CORPORATION
+ BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+ LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
+ OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
+ POSSIBILITY OF SUCH DAMAGE.
+-->
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>CSS Test: Box-pack start places flexbox items at the left side (in horizontal)</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+        <link rel="help" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/"/>
+        <meta name="flags" content="image" />
+        <meta name="assert" content="box-pack: start pushes the child boxes all the way to the left" />
+        <style type="text/css">
+            .box
+            {
+                display: -ms-box;
+                display: -moz-box;
+                display: -o-box;
+                display: -webkit-box;
+                display: box;
+                -ms-box-pack: start;
+                -moz-box-pack: start;
+                -o-box-pack: start;
+                -webkit-box-pack: start;
+                box-pack: start;
+                background: url('../support/flexbox_100x100_green.png') top right no-repeat red;
+                width: 400px;
+                height: 100px;
+            }
+            .child
+            {
+                width: 100px;
+                height: 100px;
+                background: green;
+            }
+        </style>
+    </head>
+    <body>
+        <p>This test passes if there is no red showing.</p>
+        <div class="box">
+            <div class="child">Box1</div>
+            <div class="child">Box2</div>
+            <div class="child">Box3</div>
+        </div>
+    </body>
+</html>
index 5510b0b..dc263a5 100644 (file)
@@ -3878,3 +3878,8 @@ BUGWK85532 SKIP : fast/sub-pixel/layout-boxes-with-zoom.html  = FAIL
 BUGWK85532 SKIP : fast/sub-pixel/size-of-box-with-zoom.html = FAIL
 
 BUGWK68744 : fast/block/float/float-not-removed-from-next-sibling4.html = IMAGE+TEXT
+
+// IETC flexbox failures
+BUGWK85211 : ietestcenter/css3/flexbox/flexbox-align-stretch-001.htm = IMAGE
+BUGWK85212 : ietestcenter/css3/flexbox/flexbox-layout-002.htm = IMAGE
+BUGWK85213 : ietestcenter/css3/flexbox/flexbox-ordinal-group-001.htm = IMAGE
index 9ddf51e..da3d712 100644 (file)
@@ -261,3 +261,8 @@ BUGWK73766 : css3/unicode-bidi-isolate-aharon-failing.html = FAIL
 BUGWK85466 : css3/images/cross-fade-background-size.html = TEXT
 
 BUGWK85492 : css3/zoom-coords.xhtml = TEXT
+
+// IETC flexbox failures
+BUGWK85211 : ietestcenter/css3/flexbox/flexbox-align-stretch-001.htm = IMAGE
+BUGWK85212 : ietestcenter/css3/flexbox/flexbox-layout-002.htm = IMAGE
+BUGWK85213 : ietestcenter/css3/flexbox/flexbox-ordinal-group-001.htm = IMAGE
index 99059e2..5815700 100644 (file)
@@ -293,6 +293,11 @@ BUGWK19688 : fast/images/exif-orientation-css.html = FAIL
 // Touch adjustment not enabled
 BUGWK78801 : touchadjustment = FAIL
 
+// IETC flexbox failures
+BUGWK85211 : ietestcenter/css3/flexbox/flexbox-align-stretch-001.htm = IMAGE
+BUGWK85212 : ietestcenter/css3/flexbox/flexbox-layout-002.htm = IMAGE
+BUGWK85213 : ietestcenter/css3/flexbox/flexbox-ordinal-group-001.htm = IMAGE
+
 //////////////////////////////////////////////////////////////////////////////////////////
 // End of Expected failures
 //////////////////////////////////////////////////////////////////////////////////////////
index 39f8d48..6cf6af2 100644 (file)
@@ -198,3 +198,8 @@ BUGWK85401 : media/video-colorspace-yuv422.html = TEXT
 BUGWK85404 : fast/loader/javascript-url-in-embed.html = TEXT PASS
 
 BUGWK85408 : svg/batik/text/longTextOnPath.svg = TEXT PASS
+
+// IETC flexbox failures
+BUGWK85211 : ietestcenter/css3/flexbox/flexbox-align-stretch-001.htm = IMAGE
+BUGWK85212 : ietestcenter/css3/flexbox/flexbox-layout-002.htm = IMAGE
+BUGWK85213 : ietestcenter/css3/flexbox/flexbox-ordinal-group-001.htm = IMAGE
index 2a56fee..37c2dfc 100644 (file)
@@ -59,3 +59,8 @@ BUGWK85203 : ietestcenter/css3/multicolumn/column-width-applies-to-006.htm = IMA
 BUGWK85203 : ietestcenter/css3/multicolumn/column-width-applies-to-008.htm = IMAGE
 BUGWK85203 : ietestcenter/css3/multicolumn/column-width-percentage-001.htm = IMAGE
 BUGWK85203 : ietestcenter/css3/multicolumn/column-containing-block-003.htm = IMAGE
+
+// IETC flexbox failures
+BUGWK85211 : ietestcenter/css3/flexbox/flexbox-align-stretch-001.htm = IMAGE
+BUGWK85212 : ietestcenter/css3/flexbox/flexbox-layout-002.htm = IMAGE
+BUGWK85213 : ietestcenter/css3/flexbox/flexbox-ordinal-group-001.htm = IMAGE