diff options
Diffstat (limited to 'tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/flexbox-justify-content-vert-004.xht')
| -rw-r--r-- | tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/flexbox-justify-content-vert-004.xht | 158 |
1 files changed, 0 insertions, 158 deletions
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/flexbox-justify-content-vert-004.xht b/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/flexbox-justify-content-vert-004.xht deleted file mode 100644 index 0375141a556..00000000000 --- a/tests/wpt/css-tests/css-flexbox-1_dev/xhtml1/flexbox-justify-content-vert-004.xht +++ /dev/null @@ -1,158 +0,0 @@ -<!-- - Any copyright is dedicated to the Public Domain. - http://creativecommons.org/publicdomain/zero/1.0/ ---><!-- Testcase with a series of vertical flex containers, testing each possible - value of the 'justify-content' property, and with each individual - flex item being larger than the flexbox itself (so that there isn't any - packing space available). Also, we've got margin/border/padding on the - flex items. - * For 'flex-start'/'space-between', we should overflow on the end - (bottom) side. - * For 'flex-end', we should overflow on the start (top) side. - * For 'center'/'space-around', we should overflow equally on both sides. ---><html xmlns="http://www.w3.org/1999/xhtml"> - <head> - <title>CSS Test: Testing 'justify-content' in a vertical flex container, and its effects on flex items that overflow, with margins/border/padding on flex items</title> - <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com"/> - <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#justify-content-property"/> - <link rel="match" href="reference/flexbox-justify-content-vert-004-ref.xht"/> - <style> - body { margin-top: 100px; } /* So we can see top-overflowed stuff */ - div.flexbox { - height: 30px; - display: flex; - flex-direction: column; - margin-right: 4px; - float: left; - } - div.a { - width: 10px; - flex: 0 0 35px; - background: lightgreen; - border-style: solid; - border-color: purple; - border-top-width: 4px; - border-right-width: 3px; - border-bottom-width: 2px; - border-left-width: 1px; - padding: 2px; - } - div.b { - width: 10px; - flex: 0 0 40px; - background: pink; - padding: 1px 2px 3px 4px; - margin: 5px 4px 3px 2px; - } - div.c { - width: 10px; - flex: 0 0 45px; - background: orange; - margin: 3px; - border: 2px dashed teal; - } - </style> - </head> - <body> - - <!-- default (start) --> - <div class="flexbox"> - <div class="a"/> - </div> - <div class="flexbox"> - <div class="a"/><div class="b"/> - </div> - <div class="flexbox"> - <div class="a"/><div class="b"/><div class="c"/> - </div> - - <!-- flex-start --> - <div class="flexbox" style="justify-content: flex-start"> - <div class="a"/> - </div> - <div class="flexbox" style="justify-content: flex-start"> - <div class="a"/><div class="b"/> - </div> - <div class="flexbox" style="justify-content: flex-start"> - <div class="a"/><div class="b"/><div class="c"/> - </div> - - <!-- flex-end --> - <div class="flexbox" style="justify-content: flex-end"> - <div class="a"/> - </div> - <div class="flexbox" style="justify-content: flex-end"> - <div class="a"/><div class="b"/> - </div> - <div class="flexbox" style="justify-content: flex-end"> - <div class="a"/><div class="b"/><div class="c"/> - </div> - - <!-- center --> - <div class="flexbox" style="justify-content: center"> - <div class="a"/> - </div> - <div class="flexbox" style="justify-content: center"> - <div class="a"/><div class="b"/> - </div> - <div class="flexbox" style="justify-content: center"> - <div class="a"/><div class="b"/><div class="c"/> - </div> - - <!-- space-between --> - <div class="flexbox" style="justify-content: space-between"> - <div class="a"/> - </div> - <div class="flexbox" style="justify-content: space-between"> - <div class="a"/><div class="b"/> - </div> - <div class="flexbox" style="justify-content: space-between"> - <div class="a"/><div class="b"/><div class="c"/> - </div> - - <!-- space-around --> - <div class="flexbox" style="justify-content: space-around"> - <div class="a"/> - </div> - <div class="flexbox" style="justify-content: space-around"> - <div class="a"/><div class="b"/> - </div> - <div class="flexbox" style="justify-content: space-around"> - <div class="a"/><div class="b"/><div class="c"/> - </div> - - <!-- space-evenly --> - <div class="flexbox" style="justify-content: space-evenly"> - <div class="a"/> - </div> - <div class="flexbox" style="justify-content: space-evenly"> - <div class="a"/><div class="b"/> - </div> - <div class="flexbox" style="justify-content: space-evenly"> - <div class="a"/><div class="b"/><div class="c"/> - </div> - - <!-- left --> - <div class="flexbox" style="justify-content: left"> - <div class="a"/> - </div> - <div class="flexbox" style="justify-content: left"> - <div class="a"/><div class="b"/> - </div> - <div class="flexbox" style="justify-content: left"> - <div class="a"/><div class="b"/><div class="c"/> - </div> - - <!-- right --> - <div class="flexbox" style="justify-content: right"> - <div class="a"/> - </div> - <div class="flexbox" style="justify-content: right"> - <div class="a"/><div class="b"/> - </div> - <div class="flexbox" style="justify-content: right"> - <div class="a"/><div class="b"/><div class="c"/> - </div> - - </body> -</html>
\ No newline at end of file |